如何持續檢查網頁的當前窗口高度？

我在網站上有一個導航欄，並在達到高度（y軸）的某個點後。我想操縱我的導航欄的CSS代碼，例如背景顏色。如何持續檢查網頁的當前窗口高度？

到目前爲止很好現在我檢查一個if語句的高度，如果它克服了一定的值我操縱navbar類的css ....但我怎麼能確保這個得到不斷檢查我已經使用setInterval方法，但我不知道這是一個很好的解決方案...誰可以幫助我的人？

在此先感謝！

function update() { 
    if (currentHeight>600) { 
    $(".class").css({"background-color":"blue"}); 
    } else { 
    $(".class").css({"background-color":"transparent"}); 
    } 
} 

setInterval(update, 10);

來源

2016-06-20 javabatz

您可以用jQuery做這樣的：

$(window).resize(function() { 
    if ($(window).height()>600) { 
    $(".class").css({"background-color":"blue"}); 
    } else { 
    $(".class").css({"background-color":"transparent"}); 
    } 
});

你也可以不用jQuery的使用CSS @media標籤：

.class { 
    background-color:blue; 
} 

@media screen and (max-height: 600px) { 
    .class { 
    background-color:transparent; 
    } 
}

來源

2016-06-20 11:18:54 kkakkurt

如果您想更改CSS時你的屏幕太小了，你可能不需要jQuery：

@media screen and (max-height: 600px) { 
    .class {background-color:transparent} 
}

來源

2016-06-20 11:33:30

如何持續檢查網頁的當前窗口高度？

回答

相關問題