2011-08-16 50 views
1

我有一个div,我已经设置为绝对位置和z-index高于页面上所有其他div。我遇到的问题是绝对位置div位于某些与用户鼠标交互的div上面。有没有办法关闭绝对定位div的交互式状态,以便下面的div有效。停止与顶部元素的交互

+0

看看这个类似的问题:http://stackoverflow.com/questions/3452423/possible-a-div-overlay-which-is-completely-ignored-by-mouse-events-so-that-mo –

+0

一个示例代码就会好很多的帮助,让我们明白你要表达的 – sasidhar

+0

看到什么:http://stackoverflow.com/questions/6740242/click-link-below-a-higher-z-index-div/6740272#6740272 – thirtydot

回答

5

绝对定位元素使用z索引用于堆叠 - 这可以解释为什么以下内容是不可访问的。不幸的是,这不是一个互动状态的情况,而仅仅是障碍。

在任何绝对定位的块的元件将模糊尽可能设置为低于它们作为最上面的元件伸展的尺寸(设置在div的边界看到障碍物究竟有多远发生)元件。

你最好的选择(在CSS的范围内)是将遮蔽div放在你需要交互的地方,或者将遮蔽div的属性直接添加到被遮挡的div上 。

编辑:即在CSS中没有属性来打开或关闭交互式状态。

更新2011/11/11:看https://developer.mozilla.org/en/CSS/pointer-events一个解决问题的办法。 pointer-events: none;是对问题的有效解决方案。

+1

的SVG属性已被添加到CSS3规范允许用户“到”元素​​选择的元素: [https://developer.mozilla.org/en/CSS/pointer-events](https:// developer.mozilla.org/en/CSS/pointer-events)。 FF和Webkit支持此属性;不完全确定其他支持。 新的属性非常适合禁止与'当前'页面的链接进行交互。 – Larry

+1

很好的发现'指针事件:无;'那不是我的雷达。 –