1

我正在开发一个移动网络应用程序，但我对某些事情有点困惑：我有一个名为 UpperDiv 的 div，z-index 为 50，在该 div 下，还有另一个名为 UnderDiv，z-index 为 0。问题是，当我在 UpperDiv 上“点击”时，它会激活 UnderDiv 的一个元素（我单击的位置）上的 :active 伪类。我应该怎么做才能禁用它？

----------------------------- 已编辑 -------- ------------

它终于起作用了！！！！

我忘了提到我正在使用转换来打开/关闭我的 UpperDiv。所以打开时我正在使用：

$('#myDiv').css('-webkit-transform', 'translate3d(200px, 0px, 0px)').bind('webkitTransitionEnd', function(){
  $('.underDiv').css('pointer-events', 'none');
});

当我关闭时：

$('#myDiv').css('-webkit-transform', 'translate3d(0px, 0px, 0px)').bind('webkitTransitionEnd', function(){
  $('.underDiv').css('pointer-events', 'auto');
});

它对我来说很好，如果它可以帮助别人......

4

1 回答 1

0

如果这是在Android上，它将类似于这个问题

是否有针对具有 CSS-Position 和可点击区域的 Android 浏览器错误的解决方法？

当您更改页面的 DOM 以及一些 z-index 堆叠时，它是 Android 浏览器（并且仅存在）中的一个错误。下面的图层将成为鼠标点击的目标，即使上面堆叠了一些东西。

上述问题有一些可能对您有用的解决方法。

我读到了在两个 div 之间使用 z-index 20 的空 Flash 电影。

这是另一个问题，可能有答案 Android Webkit: Absolutely located elements don't respect z-index

在谷歌的问题页面上有一些开发人员的解决方法。 https://code.google.com/p/android/issues/detail?id=6721#c26

问题是：如果您更改 HTML 元素的 CSS（例如显示），Android 浏览器不会像 DOM 更改时那样跟踪 UI 更改。仅更改 CSS 无法正确同步更改和 UI 活动区域。他们将通过更改 DOM。

因此，如果您在 CSS 中显示高 z-index 层，请相应地更改该层的 DOM。这包括一些数据属性中的一些乱码。

评论https://code.google.com/p/android/issues/detail?id=6721#c55也可能有解决方案

于 2013-09-23T09:28:38.777 回答