检测多台显示器的屏幕宽度

Question

我的网站针对 1024x768 布局进行了优化（固定宽度）。我计划在页面两侧为分辨率宽度为 1280 或更高的人添加垂直横幅。

使用 screen.width，我可以轻松做到这一点。但是我在多台显示器的机器上尝试时遇到了问题。

让我们假设下面提到的场景：
显示器 1（主显示器）- 分辨率为 1024 x 768
显示器 2（辅助显示器） - 分辨率为 1440 x 900

screen.width 始终将宽度显示为 1024，而与我浏览页面的监视器无关。如果我将主监视器更改为监视器 2，则这些值会反转。

这是一个大问题，尤其是对于将 1024x768 分辨率作为主要分辨率的人来说。这意味着在这种情况下我可能会失去横幅展示次数。

我非常感谢您对此的任何帮助。

Answer 1

尝试查看window.innerWidth（屏幕上网页的宽度）而不是window.screen.width。

Answer 2

感谢您的回复。帮我编译了下面的函数，为我解决了这个问题。

function getBrowserWith()
{
    if(($.browser.msie == true && $.browser.version == '9.0') || $.browser.webkit == true || $.browser.mozilla == true)
        return window.innerWidth;
    else if(($.browser.msie == true) && ($.browser.version == '7.0' || $.browser.version == '8.0'))
        return document.documentElement.clientWidth;
    else
        return screen.width;
}

重要提示

1. 需要 jQuery 1.4+
2. 请注意，上述功能仅针对 IE7+、FF7+ 和 Chrome16+ 浏览器进行了测试。