是否可以在浏览器的滚动条上覆盖DIV？

Question

是否可以在浏览器的滚动条上覆盖DIV？

Nat*_*ate 6 html css

有什么方法可以在浏览器的滚动条上叠加DIV吗？

我意识到可以使用来隐藏滚动条overflow: none，但我想实际将DIV放在滚动条上而不是将其隐藏。

Answer 1

Eps*_*neR 6

如果该滚动不是针对<html>元素的，则可以将div放在滚动条上。这是使另一个div滚动条上的div溢出的代码。

JSFiddle

HTML：

<body>
    <div id="content">
        Code goes here instead of BODY
        <div class="test"></div>
    </div>
    <div class="overflow">CONTENT FOR OVERFLOW ELEMENTS</div>
</body>

Run Code Online (Sandbox Code Playgroud)

CSS：

html, body {
    margin:0;
    padding: 0;
}
#content {
    background: lime;
    overflow: auto;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.overflow {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 10px;
    background: blue;
}

.test {
    background: red;
    height: 1000px;
    margin: 20px;
}

Run Code Online (Sandbox Code Playgroud)

Answer 2

ish*_*ood 4

不可以，您无法在视口之外渲染内容。但是，您可以删除浏览器的滚动条并替换为您自己的滚动条，从而提供更大的灵活性。

请参阅此问题以获取更多信息。

归档时间：	11 年，4 月前
查看次数：	7655 次
最近记录：	7 年，11 月前