Jquery 检测移动设备上哪个视图处于活动状态

我需要知道手机或平板电脑上的用户是垂直还是水平浏览网站，以切换我的图像比例

例如：

如果用户在水平方向上查看页面，则可以使用“我的图像”的样式以全比例查看页面

img{width:100%; height:auto;}

但是如果它是垂直的，css将需要切换到

img{width:auto; height:100%;}

那么我如何在jQuery、Javascript或媒体查询中实现这样的功能呢。。。等等，这样我就可以根据用户在手机或iPad上查看页面的方式来选择好的样式了

---

谢谢

您可以使用一些javascript检测方向，如：

detectOrientation();
    window.onorientationchange = detectOrientation;
    function detectOrientation(){
        if(typeof window.onorientationchange != 'undefined'){
            if ( orientation == 0 ) {
                 //Do Something In Portrait Mode
            }
            else if ( orientation == 90 ) {
                 //Do Something In Landscape Mode
            }
            else if ( orientation == -90 ) {
                 //Do Something In Landscape Mode
            }
            else if ( orientation == 180 ) {
                 //Do Something In Landscape Mode
            }
        }
    }

---

从

开始，您不能只使用带有特定断点的响应式css吗

有点像这样：

@media screen and (max-width: 123px /* your value */ ) {
  img{width:auto; height:100%;}
}

---

在iPad、iPhone上似乎效果很好，但在Android上。。。它做了一些令人讨厌的事情：（@Warface它应该是跨平台的，查看关于这个主题的最完整的信息，包括回退！