Question

我们说我有

<div class="fixed">
    <div class="abs"></div>
</div>

和css：

.fixed{
    position: fixed;
    top:100px;
    width:100%;
    height:300px;
    border:1px solid turquoise;
    overflow:scroll;
}
.abs{
    position: absolute;
    width:50px;
    height:50px;
    top:-50px;
    left:0;
    border:1px solid orange;
}

现在.abs和.fixed具有相同的父级，我使用javascript将其定位在固定元素上方，但我想知道是否还有其他方法。

那么有可能以某种方式使.abs可见吗？ Fiddle

Answer 1

我真的不明白为什么你必须那样做。

顺便说一句。你应该有一个固定的容器。 HTML：

<div class="container">
    <div class="fixed"></div>
    <div class="abs"></div>
</div>

CSS：

.fixed{
    position: absolute;
    width:100%;
    height:300px;
    border:1px solid turquoise;
    overflow:scroll;
}
.abs{
    position: absolute;
    width:50px;
    height:50px;
    top:-30px;
    left:0;
    border:1px solid orange;
}
.container {
 position: fixed;
    width: 300px;
    top: 40px; left: 40px;
}

https://jsfiddle.net/fujmw79t/3/

Answer 2

只需删除overflow:scroll;上的.fixed：

＆＃13;

.fixed{
    position: fixed;
    top:100px;
    width:100%;
    height:300px;
    border:1px solid turquoise;
}
.abs{
    position: absolute;
    width:50px;
    height:50px;
    top:-53px;
    left:-1px;
    border:1px solid orange;
}

＆＃13;

<div class="fixed">
    <div class="abs"></div>
</div>

＆＃13;

是否可以显示一个元素溢出的元素：滚动？

2 个答案: