将z-索引应用于div溢出(滚动条)
将z-索引应用于div溢出(滚动条)
提问于 2016-07-29 05:59:43
我有一个带有水平滚动条的div和整个页面上的图像(或其他div) (具有绝对位置)。问题是，我想要能够滚动的div，是旁边的图像。对于a链接，我将它们定位为相对的和应用的z-索引。如何仅将z-index 应用于div的滚动条？所以，我希望div在图像后面。
屏幕拍摄示例：
可视化示例：
<div style="overflow-x: scroll; overflow-y: hidden; width: 300px; height: 130px; white-space: nowrap;">
s sd ds fsd fs df s fs fds fsd fsd fsd fds f sdf sd fs fsd f sdf sd f sdf sd f sdf ds fsdf sf ds f sdf dsf sdf s df sdf sdf ds fsd fsdf sd fds
<br/>fsd fds f sd fsd fsd fds fs df sd f sd fds f sd f sdf sd f ds fsdf s df sd fs df sdfsd f
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
</div>
<div style="position: absolute; top: 0px; left: 0px;">
<img src="http://www.wabmo.com/Album/watermark/watermarks/Sample-trans.png" width="300"/>
</div>
谢谢!
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-07-29 06:06:40
将pointer-events:none添加到由img标记组成的另一个div中。
<div style="position: absolute; top: 0px; left: 0px;pointer-events:none;">
<img src="http://www.wabmo.com/Album/watermark/watermarks/Sample-trans.png" width="300;"/>
</div>Stack Overflow用户
发布于 2016-07-29 06:13:38
我希望这对你有帮助
.sample
{
position: absolute; top: 0px; left: 0px;pointer-events:none;
}
<div style="overflow-x: scroll; overflow-y: hidden; width: 300px; height: 130px; white-space: nowrap; ">
s sd ds fsd fs df s fs fds fsd fsd fsd fds f sdf sd fs fsd f sdf sd f sdf sd f sdf ds fsdf sf ds f sdf dsf sdf s df sdf sdf ds fsd fsdf sd fds
<br/>fsd fds f sd fsd fsd fds fs df sd f sd fds f sd f sdf sd f ds fsdf s df sd fs df sdfsd f
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
<br/>sdf ds f sdf sd f dsf sd fds f ds fs df sd fds f ds f sd fs df sd fsdfs df sdf sd fs df sd fsd
</div>
<div class='sample'>
<img src="http://www.wabmo.com/Album/watermark/watermarks/Sample-trans.png" width="300"/>
</div>Stack Overflow用户
发布于 2016-07-29 06:21:48
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/38651494
复制相关文章
相似问题
腾讯云开发者
