css - 特定の div のスクロールを有効にし、ページのスクロールを無効にする方法

Question

ページのスクロールを無効にして、ページdiv内の特定の部分だけを有効にすることはできますか?

score 21 · Accepted Answer

無効にするには:

CSS

.disableScroll{
      overflow-y:hidden;
      overflow-x:hidden;
}

<body class="disableScroll">無効に追加するだけです

インラインスタイル <body style="overflow:hidden">

div を使用する場合は、スクロールを有効のままにします<div style="overflow:auto;">

垂直スクロールプロパティにはoverflow-yを、水平スクロールプロパティにはoverflow-xを使用できることに注意してください。

score 15 · Accepted Answer

CSSのみの解決策でよろしいですか？

その場合は、overflow: hidden を body に追加し、overflow: auto をスクロール可能な div に追加します。

body {
  overflow: hidden;
}

#scroller {
  overflow: auto;
  height: 100px;
}

score 1 · Accepted Answer

ページ全体:

body {
  height: 100%;
  width: 100%;
}

たとえば、divの場合：

div.scroll {
    width:180px;
    height:170px;
    overflow:auto;

}

htmlで：

<div class='scroll'></div>

score 0 · Accepted Answer

HTML:

<div class="scrollDisable"></div>

CSS:

.scrollDisable{
  overflow-y:hidden;
  overflow-x:hidden;

}

ページ全体の場合:

 body {
  height: 100%;
  width: 100%;
}

これが役立つことを願っています。

4 に答える 4