Modernizr 미디어 쿼리가 작동하지 않습니까?

Question

나는 내 사이트에 모더 나이저를 포함 :

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/modernizr.custom.js"></script> 

나는 custom.js이 있습니다

if (Modernizr.mq("screen and (max-width:480)")) { 
alert("hello"); 
} 

나는 480 픽셀을로 브라우저 크기를 조정할 사이트를 새로

,하지만 난 'didn를 어떤 경고라도 보지 마라.

이 문제를 해결하기위한 제안이 있으십니까?

Answer 1

당신은 미디어 쿼리의 단위 값 px 필요합니다

이

귀하의 라인 :

if (Modernizr.mq("screen and (max-width:480)")) {\ 

가되어야한다

if (Modernizr.mq("screen and (max-width:480px)")) { 

Answer 2

웨슬리를 잘하지만, 그냥 빨리 메모 기억 if (Modernizr.mq("screen and (max-width:480px)")) {은 여전히 ​​미디어 쿼리 조건이 충족되는 경우에만 트리거됩니다!

그래서 화면이 480px보다 크고이 스크립트가 호출되면 경고하지 않습니다. 오타했다

  //Test to see if media queries are acceptable 
      if(Modernizr.mq('only all')){ 
       var mql = window.matchMedia('(max-width: 980px)'); 

       mql.addListener(tabletChange); 
       tabletChange(mql); 

       function tabletChange(mediaQueryList) { 
        //If media query triggered 
        if (mediaQueryList.matches) {  
         //SMALL SCREEN 
        } else { 
         //LARGE SCREEN 
        } 
       } 

      } else { 

       var resizeTimer; 
       mediaMatchFallback(); 

       $(window).resize(function(){ 
        if(resizeTimer){ 
         clearTimeout(resizeTimer); 
        } 
        resizeTimer = setTimeout(mediaMatchFallback, 500); 
       }); 

       function mediaMatchFallback(){ 
        if($(window).width() <= 980){ 
         //SMALL SCREEN 
        }else{ 
         //LARGE SCREEN 
        } 
       } 
      }