Jquery 如果元素可见，请等待元素淡出

这可能是一个复制品，但我找不到，所以我们到了。 我有两个全屏覆盖显示与淡入过渡后，按下一些按钮。背后的逻辑应该是：

如果（layerA可见）

然后（淡出图层a；等待过渡完成；淡出图层b；）

else（fadeIn layerB）

代码实际上非常简单：

if (layerA.is(':visible')) {
  layerA.fadeOut("slow", function () { layerB.fadeIn("slow"); }
else { layerB.fadeIn("slow"); }

---

但是我想知道是否有一种更优雅的方式可以做到这一点。

我对

CSS

知之甚少，所以请您选择自己的风格。我想你正在期待下面的演示

$（'.overly2'）.hide（）；
$（'.overla1'）。淡出（'800'）；
setTimeout（函数（）{
$（'.overlay2'）.fadeIn（'slow'）；
}, 800);
.overlay1{
背景色：#ccc；
位置：绝对位置；
z指数：1000；
不透明度：.5；
宽度：100%；
身高：100%
}
.覆盖2{
背景色：#333；
位置：绝对位置；
z指数：1000；
宽度：100%；
身高：100%
}

这是叠加图1
这是overlay 2
我不知道这是否是您想要的，但这是一个简单的FadeIn&FadeOut，使用JQuery有两个元素：


$（文档）.ready（函数（）{
$（#picOne'）.fadeIn（1500）、delay（3500）、fadeOut（1500）；
美元("picTwo"),延迟(5000),法代因(1500),；
});
#picOne，
#皮克托{
显示：无；
位置：绝对位置；
}
#照片{
宽度：200px；
高度：200px；
}

你试过CSS@keyframes吗？你能详细说明一下吗？会给出一个快速演示，所以你希望LayerA淡出，然后layerB淡出？是的，但LayerA可能可见或不可见，我们不知道。不，这是一个接一个地隐藏两层，我期望的是交换它们，但如果其中一个已经隐藏，则无需隐藏。请重新检查。