javascript - $(window).width() 在 IE9 中不起作用

Question

可能重复：
$(window).width() 在 IE9 中不起作用

我正在尝试为响应式网页设计做一些 DOM 操作。在 IE 中，这不起作用。

var w = $(document).width(); 

if (w > 940) {
console.log("If test");     
} else {
console.log("Else test");

如果我使用 window.width，它可以在 IE 中工作，但在其他浏览器中停止工作。有没有跨浏览器的方式呢？

score 2 · Accepted Answer

var maskWidth = window.innerWidth;
var maskHeight = window.innerHeight;

score 2 · Accepted Answer

响应式设计应该在 CSS 中使用媒体查询来完成：

@media all and (max-width:940px) {
    /* some style rules that should be put in place
       if the window is smaller than 940px wide */
}

score 2 · Accepted Answer

您的方法存在一个固有问题，那就是“响应式”是指设计响应大小的变化。通过您在此处执行的操作，您只会在浏览器加载时得到检测。

例如，假设您正在使用 iPhone 浏览该网站，并且您将手机 45 度转为横向而不是纵向。本质上，你的宽度只是改变了，但你的 width() 没有。

如果您需要使用 javascript 进行 DOM 操作并且无法使用纯 CSS 完成它（这通常是最好的方法），我建议您查看几个选项：

3 回答 3