当z-index为负值时,onclick无法在webkit或mozilla中运行

时间:2012-09-04 20:42:59

标签: javascript css onclick z-index

我有以下div设置,仅适用于IE9。在Moz和Webkit上,onclick不会触发。如果我将z-index变为0,则onclick可以工作,但我对网站中的其他元素有可见性问题。有没有办法通过负z-指数来点击?

<div id="adbg" style="margin: 0pt auto; height: 1000px; width: 100%; position: fixed; cursor: pointer; z-index: -1;">
<div OnClick="window.open('/bgClicks/2');" style="background: #fff url('http://www.example.com/img/bg/w_1.jpg') no-repeat center top fixed; height: 100%; width: 100%; margin: 0pt auto; cursor: pointer;"></div>
</div>
<div id="wrapper">

1 个答案:

答案 0 :(得分:3)

这里的z-index为-肯定是个问题。 Moz / Webkit中发生的事情是预期的结果,你必须对拾取点击的对象进行隐形/透明覆盖,从而不会让它进入实际链接。

你可以做几件事。
1)找到覆盖它的对象(在Chrome中非常简单,只需右击 - 检查元素,通常鼠标下的直接元素将在检查器中自动突出显示。然后对于此元素,给出一个css规则:

pointer-events: none;

这允许点击通过它和下面的对象注册。 请注意browser support因为这不是很好,所以我建议另一个解决方案:

2)重构你的代码,这样你就不会遇到这个问题,在逻辑世界中你为什么还要在链接的顶部有任何东西,这真的是糟糕的结构,重新考虑你的边距/填充,或者制作一个jsfiddle,这样我们可以更好看:)。