페이지를 새로 고치지 않고이 문장을 어떻게 할 수 있습니까?

Question

저는 CSS 미디어와 JQuery를 사용하여 반응 형 웹 사이트를 구축하고 있습니다.

나는 페이지 너비를 확인하는 스크립트를 생성 :

if ($(window).width() < 1240) { 
$("#menu").toggle(); //hide menu 
    $('#body-wrap').toggleClass('shifted'); //puts the body width to 100% 
    $('#navbar').toggleClass('shifted'); //puts the navbar width to 100% 
} 

을하지만이 페이지를 새로 고침 할 때이 코드는 작동합니다.

어떻게 자동으로 수행 할 수 있습니까?

감사합니다.

Answer 1

resize 이벤트에 넣습니다. https://developer.mozilla.org/en-US/docs/Web/API/Window.onresize

이 이벤트 :

window.addEventListener('resize', function() { 
    // Your code 
}); 

당신은 당신은 onresize 이벤트에 추가해야

Answer 2

(즉, 대한 미디어 쿼리를 보면)하지만, 대신에이 작업을 수행하기 위해 CSS를 사용하는 것이 좋습니다 창 크기를 조정할 때마다 호출되므로 변경 사항에 응답 할 수 있습니다.

는하지만 더 나은 옵션과 같이, CSS 미디어 쿼리를 사용하는 것입니다 생각 :

@media only screen 
and (max-device-width : 1240px) { 

    #menu { 
     display: none; 
    } 
} 

예와 정보에 : http://css-tricks.com/snippets/css/media-queries-for-standard-devices/