我将固定div放置在带有滚动条的其他div中有问题。它与滚动条重叠。它发生在Safari浏览器下,即11。当我用滚动条将z-索引设置为低于div时,它的下边是固定div,并且失去了交互作用(您不能单击链接等)。我还尝试了将其固定为绝对值的假固定位置并用滚动条将javaScript的“left”设置为“scrollLeft” div,但我不能使用此解决方案,因为它在Safari和IE10下产生了奇怪的效果。
这是代码:
的HTML
<div id="cont">
<div class="spacer s2"></div>
<div id="target" class="box2 blue">
<a href="dfsdfsd">dsfsdf</a>
</div>
</div>
的CSS
#cont {
width:100%;
height:800px;
overflow:hidden;
overflow-x: scroll;
z-index:0
}
#target {
width:200px;
height:800px;
position:fixed;
overflow:hidden;
background-color:red;
z-index:0
}
.spacer {
width:3000px;
height:1px;
z-index:-1
}
并链接到jsFiddle。
请帮我香港专业教育学院试图寻找解决方案超过3天
提前致谢
最佳答案
将Position
从fixed
更改为absolute
<div id="target" class="box2 blue" style="width: 200px; height: 800px; position: absolute; overflow: hidden; background-color: red; z-index:0">
<a href="dfsdfsd">dsfsdf</a>
</div>
关于javascript - 固定div重叠滚动条,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23057961/