어떻게 지속적으로 웹 페이지의 현재 윈도우의 높이를 확인?

Question

는 I는 웹 사이트와 높이 (y 축)의 특정 지점에 도달 한 후 메뉴 바있다. 내 navbar의 CSS 코드 (예 : 배경색)를 조작하고 싶습니다.

지금까지 너무 좋아서 if 문으로 높이를 확인하고 특정 값을 극복한다면 navbar 클래스의 CSS를 조작합니다 ...하지만 어떻게하면 이것이 계속 검사되는지 확인할 수 있습니다. 저를 도울 수 setInterval을 방법 그러나 이것은 좋은 해결책이 확실하지 경우 메신저 ... 누구?

미리 감사드립니다.

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

setInterval(update, 10); 

Answer 1

이 같은 jQuery를 함께 할 수 있습니다

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

또한 CSS를 @media 태그를 사용하여 JQuery와하지 않고 그것을 할 수

: 당신이 때 CSS를 변경하려면

.class { 
    background-color:blue; 
} 

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

Answer 2

을 화면이 너무 작습니다, 당신은 jQuery를 필요로하지 않을 수 있습니다 :

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