[英]JavaScript media queries
我正在尝试使用媒体查询来减小小屏幕的立方体大小。 我在 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
});
});
可能是因为您使用的是location.reload()
,它将刷新页面而不运行任何后续代码?
您还在resize
处理程序之外进行检查,因此您只根据窗口的原始大小绑定适当的处理程序。 (实际上,如果窗口小于 600,您将绑定两个处理程序并且它们都会运行!) if
在您的处理程序中,您可能希望这样做。
仅供参考,这不是“媒体查询”; 这些是具有从 CSS 移植的特定语法的特定新功能。 screen
是一个古老的 DOM0 东西。
另外我不得不说无休止地旋转的立方体很烦人。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.