4

私が期待しているのは、コンテンツがなく、スクロールする必要がないため、オーバーフローしていないページです。しかし、私が得ているのは空のページですが、まだスクロールしており、タッチイベントで表示されるスクロールバーの表面的な問題だけではありません。ビューポートの背景を実際にオフセットします。

body ブロックの幅と高さがビューポートのサイズであり、それ以上ではないことを確認するために、Google が投げかけたすべてのことを試してきました。また、over-flow: hidden to no valid も試しました。また、ボディサイズをビューポートよりも小さく設定しようとしましたが、まだうまくいきません。

 <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>mobile</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
        <style type="text/css" media="screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 1.5)">

            body, html{
                padding: 0px;
                margin: 0px;
                border: 0px;
                min-height: 100%;
                min-width: 100%;
                max-width: 100%;
                overflow:hidden;
            }

            body{
                background-image: url(lol.gif);
            }


        </style>
    </head>

    <body>
    </body>
</html>

また、android の chrome でこれを表示しているときに、document.documentElement.clientWidth を介してビューポートの幅を報告するための JavaScript もいくつか作成しました。私はこれをさらに一歩進めてこれを実行しました:document.getElementsByTagName('body')[0].style.width = (document.documentElement.clientWidth-100)+"px"; それでもスクロールできます。

これは本当に私のジミーをざわめかせています。

私が試したこと:

  • 最小高さ: 100%、最小幅: 100%
  • オーバーフロー x とオーバーフロー y を非表示に
4

1 に答える 1

0

宣言から 'width=device-width' を削除してみてください。あなたが説明したのとまったく同じ問題があり、「width = device-width」を削除すると修正されました。

于 2014-02-27T10:40:08.300 に答える