Html 如何在不隐藏其他DIV的情况下发现其他DIV覆盖的DIV？

我有四个div，将屏幕平均分成4个部分。画布还有另一个全屏DIV

我想让这些DIV不会互相阻碍——也就是说，如果用户单击较小DIV（4个DIV中的一个）中的链接，他们会得到这个链接，如果用户单击大DIV中的canvas元素，该元素会响应

这是密码。。。谢谢大家!

#graph-container {
    top: 50px;
    bottom: 50px;
    left: 50px;
    right: 50px;
    position: fixed;
    z-index: 9;
    padding-left: 0px;
    padding-right: 0px;
    -webkit-animation: blink 2s linear 0s;
}


#NW { z-index: 10; position:fixed; width:50%; height:50%; top:0;   left:0; }
#NE { z-index: 10; position:fixed; width:50%; height:50%; top:0;   left:50%; }
#SW { z-index: 10; position:fixed; width:50%; height:50%; top:50%; left:0; }
#SE { z-index: 10; position:fixed; width:50%; height:50%; top:50%; left:50%; }

---

使用指针事件，您可以单击覆盖div，但覆盖包含可单击的元素

jsFiddle：

---

为你的4个分区使用绝对位置。同样为了更好地回答问题，你的标记制作了一个JSFIDLE，它似乎可以工作，所以你是说你希望四个元素后面的画布可以点击？但是现在上层的链接不能按OP的要求点击。我认为如果没有一些巧妙的脚本，这是不可能的。啊，您可以将子元素上的指针事件重置为自动，这也允许在上层进行单击！

#NW{
    pointer-events:none;
}
#NW * { 
    pointer-events:auto;

}