在javascript中获取设备宽度

Question

有没有一种方法可以使用javascript获取用户设备的宽度，而不是视口的宽度？

我可以说CSS媒体查询提供了这一点

@media screen and (max-width:640px) {

    /* ... */

}

和

@media screen and (max-device-width:960px) {

    /* ... */

}

如果我将智能手机定位为横向模式，这将很有用。例如，就max-width:640px我所知，在iOS 上，即使在iPhone 4上，也将同时声明横向和纵向模式的声明。 对于Android，情况并非如此，因此在这种情况下使用device-width成功地同时针对两个方向，而不定位台式机设备。

但是，如果我基于设备宽度调用javascript绑定，则似乎只能测试视口宽度，这意味着需要进行以下额外测试，

if ($(window).width() <= 960 && $(window).height <= 640) { /* ... */ }

考虑到设备宽度可供CSS使用的提示，这对我来说似乎并不优雅。

Answer 1

您可以通过screen.width属性获取设备的屏幕宽度。有时，在处理窗口大小通常小于设备屏幕大小的台式机浏览器时，使用window.innerWidth（通常在移动设备上找不到）也很有用。通常，在处理移动设备和桌面浏览器时，我使用以下方法：&nbsp;var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;