jQuery - 클래스가 적용될 때 DOM 새로 고침?

사용자가 모바일 장치 또는 데스크톱에서 페이지를로드하는 경우 메가 메뉴가 작동하는 방식을 제어하기 위해 클래스를 본문에 적용한 경우 문제는이 방식으로 클래스를 추가 할 때 아무 것도 발생하지 않으므로 dom에없는 것으로 가정하므로 발사,이 주변에 방법이 있습니까?jQuery - 클래스가 적용될 때 DOM 새로 고침?

if (Modernizr.mq('only all and (max-width: 599px)')) { 
    $('body').removeClass('desktop').addClass('mobile'); 
} 

if (Modernizr.mq('only all and (min-width: 600px)')) { 
    $('body').removeClass('mobile').addClass('desktop'); 
} 


$('.mobile .navigation nav > ul > li').on({ 
     mouseenter: function (e) { 
      $(this).find('.dropdown').delay(200).slideDown(); 
     } 
}); 

$('.desktop .navigation nav > ul > li').on({ 
     mouseenter: function (e) { 
      $(this).find('.dropdown').delay(200).addClass("hovered"); 
     }, 
     mouseleave: function (e) { 
      $(this).find('.dropdown').removeClass("hovered"); 
     } 
});

출처

2014-12-10 Adam

당신은'$ (문서)에서 전체를 감싸는 시도가 .ready'? – mvuajua

페이지가 데스크톱 클래스가 적용된 상태로로드되고 모바일 크기로 화면 크기를 변경한다고 말하면 모바일 기능이 작동하지 않으며 반대의 경우도 마찬가지입니다 (클래스를 전환하는 다른 코드가 있음을 유의해야합니다. 주위에 화면 크기 조정) – Adam

다음 브라우저 크기 조정을 수신 대기하고 다시 실행해야하는 모든 코드를 거기에 넣는 이벤트가 필요합니다. 사용자가 여전히있는 동안 여러 번 실행하지 않도록 조절해야합니다. 크기 조정) – mvuajua

나는에게 mediaquery에 대한 바로 if (Modernizr.mq('only all and (max-width: 599px)')) {에만 검사를 얻고 어떤 이벤트가 연결되지 않은 경우?!

이 시도 브라우저의 크기 조절에 대한 귀하의 폭을 확인하려면 다음

$(window).resize(function() { 
    if (Modernizr.mq('only all and (max-width: 599px)')) { 
     $('body').removeClass('desktop').addClass('mobile'); 
    } 

    if (Modernizr.mq('only all and (min-width: 600px)')) { 
     $('body').removeClass('mobile').addClass('desktop'); 
    } 
});

출처

2014-12-10 13:12:18

jQuery - 클래스가 적용될 때 DOM 새로 고침?

답변

관련 문제