使DIV固定在可滚动的DIV中

wil*_*oup 6 html javascript

现在有没有人如何在另一个可滚动修复的DIV中制作DIV,这样无论我滚动多少,DIV总是停留在同一个地方?

任何帮助将不胜感激.

Fre*_*rik 7

试试这个:

<style type="text/css">
    .scrollable {
        width: 200px;
        height: 200px;
        background: #333;
        overflow: scroll;
    }
    .fixed {
        position: absolute;
        top: 180px;
        width: 200px;
        height: 20px;
        background: #fa2;
    }
</style>
<div class="scrollable">
    im scrollable<br><br>
    im scrollable<br><br>
    im scrollable<br><br>
    im scrollable<br><br>
    im scrollable<br><br>
    im scrollable<br><br>
    <div class="fixed">and I'm fixed</div>
</div>
Run Code Online (Sandbox Code Playgroud)

  • Fredrik的答案不准确,因为`.fixed`相对于文档而不是可滚动的div定位.将`position:relative;`添加到`.scrollable`将解决这个问题但会使`.fixed`相对于`.scrollable`内容固定,而不是`.scrollable`视口,我相信你是什么试图实现. (8认同)