Question

如何创建一个具有最大宽度/高度的div，而不是让scollbars还有什么东西仍然可以滚动？（通常通过鼠标滚轮，选择文本并向下移动鼠标或向下箭头）

我试过隐藏但是这不让我滚动。其他选项要么不允许它有最大高度，要么放置滚动条。

这是sample demo。我想没有滚动条，但能够看到eof。

<div id=main>
    Text text text text text text text text...
    Text text text text text text text text...
    eof
</div>

#main {
    max-height: 400px;
    /*overflow: auto;*/
    overflow: hidden;
}

Answer 1

如何将滚动条推入隐藏区域？

html,
body {
    padding: 0;
    margin: 0;
    overflow: hidden;
}
#container {
    position: absolute;
    left: 0;
    top: 0;
    right: -30px;
    bottom: 0;
    padding-right: 15px;
    overflow-y: scroll;
    max-height: 400px;
}

JSFiddle

来自SO - Hide the scrollbar but keep the ability to scroll with native feel。

的示例

Answer 2

对于支持Web工具包引擎的浏览器（如Chrome），您可以使用此

#main ::-webkit-scrollbar 
{
    width: 0px;
}

但是对于其他浏览器，您还需要其他东西。

溢出滚动没有滚动条

2 个答案: