我制作了一个 jsfiddle，以便您可以重现该错误: FIDDLE
我实现了一个轮播来显示 3 张图像。有一个当前图像(正在显示的图像)，另外两个图像保持隐藏状态，直到我单击其中一个横向箭头，导致下一个图像从覆盖(现在是上一个)当前图像的一侧滑动。
我花了两个小时试图弄清楚为什么在某些特定的“过渡”中动画似乎不起作用。例如，当单击向左箭头从第一个图像传递到第二个图像以及从第二个图像传递到第三个图像时，动画工作正常，但是当再次单击它时，从 3 到 1 的过渡不会执行幻灯片动画。当沿相反方向移动时(使用右箭头)，仅对一个过渡进行动画处理。我认为问题与点击事件处理函数中的 if 有关，但无法找出导致该问题的原因。
任何帮助将不胜感激。
TIA
最佳答案
这里的根本问题与三个图像的 z 顺序有关。您的幻灯片动画仅在滑入的图像位于显示图像上方的情况下显示； “损坏的”过渡实际上正在发生，它们只是被“更高的”可见图像遮盖了。
您可以通过显式设置新图像和当前图像的 z 索引来解决此问题。例如，在右侧过渡中:
prevLandscape.zIndex(1);
currLandscape.zIndex(0);
如果您这样做，您还需要增加箭头的 z 索引，以便它们位于图像上方。
关于javascript - 在轮播上滑动图像时出现奇怪的行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29665455/