자바 스크립트 미디어 쿼리

Question

미디어 쿼리를 사용하여 작은 화면의 큐브 크기를 줄이려고합니다. 내 큐브 크기가 js ... 이지만 큐브에 설정되어 있기 때문에 js에서 미디어 쿼리를 보냈습니다. 크기는 내가 브라우저 창을 줄일 때 location.reload()를 사용하고 있기 때문에 .... 당신이 ........ 왜 작동하지 않는 그 아마

http://jsfiddle.net/rajkumart08/8YK2n/embedded/result/

$(window).bind('resize', function() { location.reload(); 

      Gallery.setOptions({ 
        size: 78, 
        lightbox: false, 
        //animation: 'drop' 
        //speed:  500, 
        //closeOnEsc: true, 
        //slideshow: false, 
        //slideshow_speed: 3000, 
        //cube_speed: 1000 
       }); 

     }); 

     if (screen.width < 600) { 


      $(window).bind('resize', function() { location.reload(); 

      Gallery.setOptions({ 
        size: 25, 
        lightbox: false, 
        //animation: 'drop' 
        //speed:  500, 
        //closeOnEsc: true, 
        //slideshow: false, 
        //slideshow_speed: 3000, 
        //cube_speed: 1000 
       }); 

     }); 

Answer 1

을 말해 줄 수 감소되지 않는다 그러면 페이지가 새로 고쳐지며 후속 코드가 실행되지 않습니다. 당신은 단지 윈도우의 원래 크기에 따라 적절한 핸들러를 바인딩 할 수 있도록

---

또한, 체크 resize 핸들러의 외부을하고 있습니다. 실제로 윈도우가 600보다 작 으면 핸들을 모두 처리기로 바인딩하면 둘 다 실행됩니다! 핸들러 안에 if이 있어야 할 것입니다.

참고로, 이것은 "미디어 쿼리"가 아닙니다. 그것들은 CSS에서 포팅 된 특별한 문법을 ​​가진 특별한 새로운 기능입니다. screen은 고대 DOM0 것입니다.

또한 끝없이 회전하는 큐브가 꽤 귀찮습니다.