2

我有以下 HTML 标记

<div id="main">
 <div id="div1" style="position:relative;"></div>
 <div id="div2" style="z-index:-1; position:relative; overflow:auto; height:500px;"></div> 
</div>

在div2我动态加载数据时，内容可能会超过 div 的高度，所以我使用了一个overflow:auto属性来显示滚动条。问题是滚动条出现在所有浏览器中，但它只在 IE8/9、FireFox 和 Chrome 中工作。在其他浏览器中，您会看到滚动条，但没有功能。

4

2 回答 2

3

您的 div2 的 z-index 为 -1。所以它落后了。这就是为什么它不起作用。

于 2012-07-14T08:03:47.070 回答
1

我有一个类似的问题，发现负 z-index 确实是问题，正 z-index 是解决方案。尝试将 div2 的 z-index 设置为 0 或某个正值 X，然后将其他元素的 z-index 设置为大于 0 或 X 的 z-index。负 z-index 会导致项目“低于” " 鼠标交互的级别，因此新的 z-indicies 将导致 div2 落后于具有更高 z-index 的其他内容，同时仍允许鼠标交互。

有关更多详细信息，请参阅此问题： 阻止鼠标交互的奇怪 z-index 行为：错误还是正常？

于 2012-08-02T07:11:26.053 回答