覆盖了PNG图像，但每个图像都有一个更改链接，一次一个-Javascript/jQuery/CSS

我真的很挣扎。我对这样的编码有一点了解，但更多的是修改，而不是实际的编码

我正在寻找一些代码，使我能够覆盖2个不同的PNG图像层（一个门和一个门把手），当点击页面上的链接时，这些图像将分别更改为不同的图像，例如不同的把手或不同的门样式或颜色

#png1 {
position:absolute;
top:0;
left:0;
z-index:0;
}

#png2 {
position:absolute;
top:0;
left:0;
z-index:0;
}

上面的CSS和下面的HTML结合在一起，给了我一个覆盖图，最好是把它放在一个框架中（可能是DIV？），然后用一个HTML链接来更改图像

<img id="png1" src="aub.png" />
<img id="png2" src="handle1.png" />

位置：绝对和z索引css属性是您的工具

车门把手的z指数必须高于车门

---

使用jQuery对行为进行更改，方法是单击链接，在图像周围添加包装器div。将其设置为相对位置。给你想要放在顶部的图像一个比你想要放在底部的图像更高的z索引

使用jqueryclick函数更改图像标记的src或显示/隐藏其他图像

假设使用.my_link_1和.my_link_2类创建两个链接，作为要更改的图像的触发器：

$(".my_link_1").click(function() {
  $("#png1").attr('src', 'red.png');
});

$(".my_link_2").click(function() {
  $("#png1").attr('src', 'blue.png');
});

---

请发布您迄今为止尝试过的代码。将代码添加到原始帖子中要更改图像，请执行

$（“#png1”）.prop（'src'，'mynewimage.png'）谢谢你的回复Billy很抱歉让你很痛苦，但是你能解释一下我是如何获得。单击功能作为链接工作的吗？我有以下内容，但如何与链接一起工作？对不起，我知道这只是简单的东西真的$（“png1”）。单击（'src'，'red.png'）；我已经更新了我的答案-希望这能解释它。有很多方法可以做到这一点，但这一种应该可以做到。