Question

我有四个DIV将屏幕均匀分成4个部分。还有另一个用于画布的全屏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%; }

Answer 1

使用指针事件，您可以单击叠加div，但叠加层包含可单击元素。

jsFiddle：http://jsfiddle.net/42wyJ/5/

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

}

Click through a DIV to underlying elements

https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

如何揭开其他DIV覆盖的DIV而不隐藏它们？

1 个答案: