Question

我有3个带滚动条的div。如果我们移动一个滚动条并且它到达滚动区域页面的末尾也会滚动。

我想解决这个问题。

html, body {
height: 100%;
 position:relative;
}

  body
 {

line-height:100px;
text-align:center;
}

  .left
 {
  position:absolute;
  margin-left:5%;
  margin-top:3%;
  display:block;
  height:80%;
   width:20%;

  overflow:auto;
 }

  .center
 {
 position:absolute;
 margin-left:25%;
 margin-top:3%;
 display:block;
 height:80%;
 width:50%;

 overflow:auto;
  }

 .right
 {
  position:absolute;
   margin-left:75%;
   margin-top:3%;
   display:block;
  height:80%;
   width:20%;

  overflow:auto;
 }

如果我们移动一个滚动条并且它到达滚动区域页面的末尾也会滚动。

Answer 1

默认情况下，body元素的边距为8px（至少在Chrome中）。在你的小提琴的情况下，这使得内容稍微大于窗口，因此出现滚动条。在主体上将边距设置为0将删除此滚动条。见jsfiddle：https://jsfiddle.net/vbvmLbmq/

当然，这只会修复你的小提琴中的滚动行为，这是窗口大小的问题。您可以通过向它们添加overflow: hidden; css规则来完全阻止在html，body元素上滚动，但请记住，这也会隐藏流过这些元素高度的任何元素。

在子元素滚动结束后继续滚动页面是浏览器应用程序行为，您无法通过页面上的javascript影响该行为。

滚动内部滚动条页面时滚动

1 个答案: