Question

以下是我想做的:

创建一个绝对定位、宽度和高度为100%的全球“ 牙冻容器”, 并创建一个比文档中所有其他元素都高的z- index 。

Here is my problem: When I create this container, my absolutely positioned element is blocking the click events that are bound to everything that is below it.

$(document).ready(function() {
    $(document).on( click touchstart ,  .block , function() {
        var $this = $(this);

        if(!$this.hasClass("disabled")){
            $this.addClass("disabled")
            $this.openPopUp();
        }
        return false;           
    });
});

请注意,我正在使用来自jQuery 1. 7. 2的新.on () 呼叫, 我设置该呼叫的功能与. live () 相同。

为什么我的元素不接受我的点击?看起来我的手势区域挡住了它,但有办法绕过它吗?

Answer 1

解决方案一. CSS. 设置 < code> 指针- events: non; , 但只对 Firefox、 Chrome 和 Safari 有效。

解决方案二. JavaScript.http://www.vinylfox.com/forwarding-mouse-events-trough-layers/

Answer 2

我不认为您可以推翻它。基本上, 事件是如何运作的, 这就是为什么您可以在屏幕中心显示一个对话框, 并在屏幕中单击它, 而不对对话框下方的元素启动同样的事件。

你可以在这个更高的元素上做类似元素, 但是这看起来像点击抓劫, 一些浏览器卡登可能标记您的网站有潜在风险。

以下是关于这个议题的类似讨论:HTML“overlay”使点击能够掉到后面的元素

友情链接