web-dev-qa-db-ja.com

HTMLのスクロールバーを無効化または削除します

HTMLページの垂直scrollbarを非アクティブ化または削除したい。
どうやってするか ？

ありがとう。

htmlcssscrollbar
20
Wassim AZIRAR

本当に必要な場合...

html { overflow-y: hidden; }
46
meder omuraliev

このコードをhtmlヘッダーに追加します。

<style type="text/css">
html {
        overflow: auto;
}
</style>
4
Greg McNulty

この場合にしようとすることは、これをスタイルシートに入れることです

html, body{overflow:hidden;}

このようにして、スクロールバーを無効にし、累積効果としてキーボードによるスクロールを無効にします

4
Raine

オムラリエフ夫人は、イベントハンドラを使用してscrollTo（0,0）を設定することを提案しました。これはWassim-azirarの例です。すべてをまとめると、これが最終的な解決策であると思います。

スクロールバー、マウスによるスクロール、キーボードの3つの問題があります。これにより、スクロールバーが非表示になります。

       html, body{overflow:hidden;}

残念ながら、キーボードでスクロールできます。これを防ぐために、次のことができます。

    function keydownHandler(e) {
var evt = e ? e:event;
  var keyCode = evt.keyCode;

  if (keyCode==38 || keyCode==39 || keyCode==40 || keyCode==37){ //arrow keys
e.preventDefault()
scrollTo(0,0);
}
}

document.onkeydown=keydownHandler;

このコードの後、マウスを使ったスクロールは自然に機能しないので、スクロールを防止しました。

例： https://jsfiddle.net/aL7pes70/1/

1
Ananth Vivekanand