溢出滚动，没有滚动条 [英] overflow scrolling with no scrollbars

问题描述

如何创建一个具有最大宽度/高度的div，而不是让scollbars无法滚动？ （通常通过鼠标滚轮，选择文本，向下移动鼠标或向下移动）

How do I create a div that has a max width/height but instead of having scollbars have nothing yet still be able to scroll? (usually done via mouse wheel, selecting text and moving the mouse down or arrrows down)

我试图隐藏，但是不让我滚动。其他选项不允许它有一个最大高度或放置滚动条。

I tried hidden but that doesn't let me scroll. The other options either doesn't allow it to have a max hight or puts scrollbars.

这是一个示例演示。我想没有滚动条，但能够看到eof。

Here is a sample demo. I'd like to have no scroll bar but be able to see 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;
} 

推荐答案

隐藏区域？

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 。

。

Example from SO - Hide the scrollbar but keep the ability to scroll with native feel.

这篇关于溢出滚动，没有滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！