5

iPadのMobileSafariで、デバイスの向きを変更した後、奇妙な動作が発生します。これが私のテストファイルです：

<!DOCTYPE HTML>
<html>
    <head>
        <meta name="viewport" content="initial-scale=0.7" />
        <style>
            #block {
                border: 1px solid red;
                background-color: yellow;
                font-size: 400%;
                width: 700px;
                height: 500px;
            }   
        </style>
    </head>
    <body>
        <div id="block">Hello world!</div>
    </body>
</html>

次のURLでMobileSafariで表示できます。

http://fiddle.jshell.net/eterps/jsTqj/show/

iPadを縦向きにしてURLに移動し、スワイプジェスチャを行うと、ページがスクロールしません。これは正しいことです。

ただし、デバイスを横向きモードに回転させてスワイプジェスチャを行うと、明らかな理由もなく、右側に余分なスペースができました。

しかし、さらに奇妙なのは、モバイルサファリを再起動して、常に横向きでURLにアクセスすると、右側の余分なスペースが存在しないという事実です。

向きを変えた後、右側に余分なスペースが表示されるのはなぜですか？そして、どうすればそれを防ぐことができますか？

4

2 に答える 2

0

デバイスを回転させると、モバイルサファリは新しい方向に一致するようにビューポートのサイズを変更します。

于 2011-03-17T09:45:24.320 に答える