在JavaScript中点击透明图片

Question

我试图制作一个主要使用DOM元素的游戏。现在我有一个问题。 DOM元素通常是矩形。问题是，如果我在另一幅图像上有透明部分的图像，如果您点击上面图像的透明部分，底部图像将不会被点击。

我搜索了一些jQuery插件对于这个问题，并发现了一些：

1. http://forum.jquery.com/topic/parrythrust-1-0-0-transparent-image-clickthrough
2. http://plugins.jquery.com/pixelselect/

这里的问题是，第一插件只检测click事件。 另一个更有希望，因为它可以检测mouseover，mouseout，click等等，但它似乎根本不起作用。

是否有解决此问题的其他解决方案？ Image Maps不是一个解决方案，因为我不认为他们可以处理具有不同z索引的重叠内容。

Answer 1

如何使用CSS Shapes？

您可以为元素定义自己的周长。圈子很容易。

.element{ 
    shape-outside: circle(50%); 
    width: 300px; 
    height: 300px; 
    float: left; 
} 

被警告说，目前只有Chrome 37+支持它，根据该文章。