Javascript 如何知道点击了哪个图像，然后一个透明的地方隐藏起来看其他图像

我需要点击任何图像。我添加了一些图片来说明这种情况

黑色边框是图层边界

如果我在红色菱形上使用z索引，我就不能按蓝色和棕色菱形，因为它被一层透明的红色菱形遮住了

如果我在蓝色菱形上使用z索引，我不能按红色和棕色菱形**，因为它被一层透明的蓝色菱形隐藏在视线之外

---

如果我在棕色菱形上使用z-index，我就不能按红色和蓝色菱形，因为被一层透明的棕色菱形隐藏在视线之外

将CUSTOM属性应用于图像，并在javascript（jquery）中使用.live或.on函数触发单击的图像

HTML:
<img class="rhombus" x="first layer"/>

JQuery:
...

$(document).on("click", ".rhombus", function(e){
alert($(this).attr("x");
});
...

HTML：
JQuery：
...
$（文档）。在（“单击”，“菱形”，函数（e）{
警报（$（this.attr（“x”）；
});
...

或者您可以尝试使用imagemap，只生成所有正方形的一个图像

---

这里有一个新的建议，但它并不是完美的。它需要你方做一点工作。但应该清楚你必须做什么；）

---

使用CSS转换和旋转项目怎么样。我想它会成功的。当然，您可能会遇到一些跨浏览器兼容性问题。它是有效的，只要看看这个JSFIDLE：使用正方形图像和css变换来旋转它们就可以了。将定义一个旋转的矩形，然后您应该解释您的问题，以便每个人都能理解您的问题。例如，请尝试：

http://jsfiddle.net/sbkhtvmo/1/

按“靠近花朵”按钮：程序警报我单击了第二层，但我按了真正的第一层

> http://jsfiddle.net/sbkhtvmo/2/