<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
jquery 菜鸟在这里。
我的主页上有这些 div 作为框架:
#top, #bottom, #left, #right {
background: #000000;
position: fixed;
z-index: 99999999;
}
#left, #right {
top: 0; bottom: 0;
width: 0.9em;
}
#left { left: 0; }
#right { right: 0; }
#top, #bottom {
left: 0; right: 0;
height: 0.9em;
}
#top { top: 0; }
#bottom { bottom: 0; }
到目前为止，这一切正常。
另外，我通过 Swipebox 定期展示我的投资组合插入。在图库中，单击其中一个缩略图后，我想添加这个框架，但颜色为白色，如下所示:
#top, #bottom, #left, #right {
background: #ffffff;
position: fixed;
z-index: 99999999;
}
#left, #right {
top: 0; bottom: 0;
width: 0.9em;
}
#left { left: 0; }
#right { right: 0; }
#top, #bottom {
left: 0; right: 0;
height: 0.9em;
}
#top { top: 0; }
#bottom { bottom: 0; }
问题来自于 z-index 位；如果我在黑色框架上放一个更大的 z-index，白色的就不会显示，反之亦然。
我想知道如何在默认情况下显示黑色的(因为它是“主要”的，在主页中)，并且在单击缩略图以访问画廊时，然后才显示黑色框架上的白色框架。
有什么想法吗？非常感谢:)
最佳答案
无需添加具有不同背景颜色的额外重复 div。而只是在您单击链接时更改框架的颜色。
假设我理解正确，这个 https://jsfiddle.net/2wqffhnj/3/这就是您想要完成的，对吗？
我只是加了一个类
.frame-color {
background: #000000;
}
点击链接时交换颜色
$("#frame-swap").click(function() {
if ($(".frame-color").css("background-color") == "rgb(0, 0, 0)") {
$(".frame-color").css({"background":"#ffffff"});
}
else {
$(".frame-color").css({"background-color":"#000000"});
}
});
关于jquery - 单击时显示/隐藏 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38128488/