是否可以隐藏溢出但仍允许滚动?

时间:2016-05-07 10:13:31

标签: javascript jquery html css

可能是一个非常愚蠢的问题,但我添加了溢出:隐藏到我的身体以消除它下面出现的空白但是这会禁用滚动,我意识到问题可能在其他地方,这不是修复,但我想知道是否可以隐藏溢出但是能够滚动?

4 个答案:

答案 0 :(得分:3)

尝试

#elem { overflow:auto }

当包含内容大于父

时,这将启用滚动

答案 1 :(得分:1)

如果你想用 webkit 这样做,你可以这样做:

#container {
  overflow: scroll;
  overflow-x: hidden;
  height:65px;
  width:350px
}
::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}
<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vehicula quam nibh, eu tristique tellus dignissim
quis. Integer condimentum ultrices elit ut mattis.
Praesent rhoncus tortor metus, nec pellentesque enim
mattis nec. Nulla vitae turpis ut dui consectetur
pellentesque quis vel est. Curabitur rutrum, mauris ut
mollis lobortis, sem est congue lectus, ut sodales nunc
leo a libero. Cras quis sapien in mi fringilla tempus
condimentum quis velit. Aliquam id aliquam arcu. Morbi
tristique aliquam rutrum. Duis tincidunt, orci suscipit
cursus molestie, purus nisi pharetra dui, tempor
dignissim felis turpis in mi. Vivamus ullamcorper arcu
sit amet mauris egestas egestas. Vestibulum turpis neque,
condimentum a tincidunt quis, molestie vel justo. Sed
molestie nunc dapibus arcu feugiat, ut sollicitudin metus
sagittis. Aliquam a volutpat sem. Quisque id magna
ultrices, lobortis dui eget, pretium libero. Curabitur
aliquam in ante eu ultricies.
</div>

答案 2 :(得分:0)

element{ overflow: scroll; }

这将删除空格,如果内容溢出,则会自动生成滚动。

答案 3 :(得分:0)

试试这个:

grep

CSS

<div class="parent">
  <div class="child">
     Lorem ipsum dolor sit amet, consectetur adipiscing elit.
     Integer vehicula quam nibh, eu tristique tellus dignissim quis.
     Integer condimentum ultrices elit ut mattis.
     Praesent rhoncus tortor metus, nec pellentesque enim 
     mattis nec. Nulla vitae turpis ut dui consectetur 
     pellentesque quis vel est. Curabitur rutrum, mauris ut
     mollis lobortis, sem est congue lectus, ut sodales nuncleo a 
     libero. Cras quis sapien in mi fringilla tempus 
     condimentum quis velit. Aliquam id aliquam arcu. Morbi
     tristique aliquam rutrum. Duis tincidunt, orci suscipit 
     cursus molestie, purus nisi pharetra dui, tempor
     dignissim felis turpis in mi. Vivamus ullamcorper arcu
     sit amet mauris egestas egestas.
  </div>
</div>