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