6

我正在尝试使用 jquery 函数计算 android 设备方向更改时的窗口宽度$(window).outerWidth(true);。此计算为两者提供了正确的方向变化宽度iphone，ipad但在 android 中没有。如果我最初以横向模式或纵向模式加载页面，我将获得正确的宽度，但是一旦我在加载页面后更改方向，我将获得纵向模式的宽度，就像在横向模式下一样，反之亦然。请建议正在发生的事情以及我该如何处理这个问题，以便我在 android 设备的方向更改时获得正确的窗口宽度

4

7 回答 7

10

为什么不只使用 javascriptscreen对象。您应该能够通过以下方式获得屏幕尺寸：

screen.height;
screen.width;
于 2012-04-18T18:59:56.920 回答
7

I was also stuck in this problem and find the best solution which will work on all the platforms.Below is the code of 'orientationchange' event.

function onOrientationChange(event)
{
    setTimeout(function(){
       'Enter you code here';
    },200);
}

Hope, it will help you and most of other too.. Cheers.

于 2013-09-22T07:03:30.670 回答
1 
                            var isMobile = {
                                Android: function () {
                                    return navigator.userAgent.match(/Android/i);
                                },
                                BlackBerry: function () {
                                    return navigator.userAgent.match(/BlackBerry/i);
                                },
                                iOS: function () {
                                    return navigator.userAgent.match(/iPhone|iPad|iPod/i);
                                },
                                Opera: function () {
                                    return navigator.userAgent.match(/Opera Mini/i);
                                },
                                Windows: function () {
                                    return navigator.userAgent.match(/IEMobile/i);
                                },
                                webOS: function () {
                                    return navigator.userAgent.match(/webOS/i);
                                },
                                any: function () {
                                    return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
                                }
                            };


                            var tell_if_mobile;
                            var mobile_tablet;
                            if (isMobile.any()) {
                                tell_if_mobile = true;
                            } else {
                                tell_if_mobile = false;
                                var windowWidth = window.screen.width < window.outerWidth ?
                                                  window.screen.width : window.outerWidth;
                                tell_if_mobile = windowWidth < 800;
                                mobile_tablet = windowWidth >= 500 ? "Tablet/Phablet Device" : "Desktop View (Mobile)";
                            }

                            var mobile_type;
                            mobile_type = isMobile.Android() ? "Android Device" :
                                          isMobile.BlackBerry() ? "Blackberry Device" :
                                          isMobile.iOS() ? "iOS Device" :
                                          isMobile.Opera() ? "Opera Mobile/Mini" :
                                          isMobile.Windows() ? "IEMobile" :
                                          isMobile.webOS() ? "webOS device" :
                                          tell_if_mobile == true ? mobile_tablet :
                                          "Not a mobile device";
alert(mobile_type); //result
于 2014-01-02T06:57:25.310 回答
1

这篇文章似乎有一个可能与您相关的解决方案：

http://forum.jquery.com/topic/orientationchange-event-returns-wrong-values-on-android

于 2012-04-19T00:53:33.883 回答
1

您可以不听orientationchange事件，而是听window resize事件，它将确保window.innerHeight/outerHeight 属性得到更新。

于 2015-08-13T05:07:36.120 回答
0

window.innerWidth分别尝试window.innerHeight；android 可能与outerWidth 和Height 无关；

于 2012-04-18T19:27:44.247 回答
0

这很丑陋，但它有效。方向更改后的移动视口高度

window.addEventListener('orientationchange', () => {
  const tmp = () => {
    this.onResize()
    window.removeEventListener('resize', tmp)
  }
  window.addEventListener('resize', tmp)
})
于 2019-11-21T15:55:15.137 回答