javascript媒体查询

时间:2013-02-28 01:23:19

标签: javascript jquery html5 jquery-ui javascript-events

我正在尝试使用媒体查询缩小小屏幕的立方体大小.... 我在js中提供了媒体查询,因为我的立方体大小设置为js ...... 但是当我减少浏览器窗口时,我的立方体大小并没有减少.... 你能告诉我为什么它不起作用........

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
                });

         });

1 个答案:

答案 0 :(得分:1)

可能是因为您正在使用location.reload(),它会刷新页面而不会运行任何后续代码?


您还在resize处理程序的进行检查,因此您只能根据窗口的原始大小绑定相应的处理程序。 (实际上,如果窗口小于600,你将绑定两个处理程序,它们都会运行!)你可能希望处理程序中有if

仅供参考,这不是“媒体查询”;这些是一个特定的新功能,具有从CSS移植的特定语法。 screen是一个古老的DOM0。

此外,我必须说无休止旋转的立方体非常烦人。