iPad不会触发从垂直到水平的调整大小事件?

dcl*_*901 35 javascript iphone resize web-applications ipad

有人注意到这种行为吗?我正在尝试编写一个会在调整大小时触发的脚本.它在普通浏览器上工作正常,在iPhone上工作正常,但在iPad上,只会触发从水平到垂直视口,反之亦然.

这是代码:

$(window).resize( function() {

    var agent=navigator.userAgent.toLowerCase();
    var is_iphone = ((agent.indexOf('iphone') != -1));
    var is_ipad = ((agent.indexOf('ipad') != -1));

    if(is_iphone || is_ipad){
        location.reload(true);
    } else {     
        /* Do stuff. */
    };
});
Run Code Online (Sandbox Code Playgroud)

Vin*_*ent 46

如果我理解正确,你想在用户倾斜iPad时做一些事情.干得好:

window.onorientationchange = function(){

    var orientation = window.orientation;

    // Look at the value of window.orientation:

    if (orientation === 0){

        // iPad is in Portrait mode.

    }

    else if (orientation === 90){

        // iPad is in Landscape mode. The screen is turned to the left.

    }


    else if (orientation === -90){

        // iPad is in Landscape mode. The screen is turned to the right.

    }

}
Run Code Online (Sandbox Code Playgroud)

左图为纵向模式,右图为横向模式

  • 当`orientation === 180`时你忘记了.这是iPad倒置的时候. (2认同)

art*_*ung 14

我想你想要的是使用iPad Orientation CSS,它看起来像这样:

<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css" />
<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css" />
Run Code Online (Sandbox Code Playgroud)

此外,orientationchange根据iPad网站开发提示,在更改方向时会触发事件.

总之,这应该为您提供足以应对变化的工具.

  • @dclowd:`window.**`on`**`orientationchange`. (2认同)

小智 7

这包括所有方向.

这有两个选择:

window.onorientationchange = function() {

    var orientation = window.orientation;

    // Look at the value of window.orientation:

    if (orientation === 0) {
    // iPad is in Portrait mode.

    } else if (orientation === 90) {
     // iPad is in Landscape mode. The screen is turned to the left.

    } else if (orientation === -90) {
     // iPad is in Landscape mode. The screen is turned to the right.

    } else if (orientation === 180) {
    // Upside down portrait.

    }
}    
Run Code Online (Sandbox Code Playgroud)

要么

// Checks to see if the platform is strictly equal to iPad:
    if(navigator.platform === 'iPad') {
            window.onorientationchange = function() {

            var orientation = window.orientation;

            // Look at the value of window.orientation:

            if (orientation === 0) {
            // iPad is in Portrait mode.

            } else if (orientation === 90) {
             // iPad is in Landscape mode. The screen is turned to the left.

            } else if (orientation === -90) {
             // iPad is in Landscape mode. The screen is turned to the right.

            } else if (orientation === 180) {
            // Upside down portrait.

            }
          }       
        }
Run Code Online (Sandbox Code Playgroud)