多个jQuery Cycle幻灯片叠加

Question

我正在使用jQuery循环插件在一个页面上创建多个幻灯片（一旦我弄清楚这个问题，将通过鼠标悬停启动/停止 - 是的，我知道有9个幻灯片放在页）。

问题是，当我告诉多个幻灯片开始循环时，无论哪个我调用cycle（）都会叠加。因此，幻灯片1中的所有图像都是叠加的，然后它们都会转换为幻灯片2等。我可以说它们是叠加的，因为每个幻灯片的第一张幻灯片都包含一个透明的PNG。

无论是在jQuery each（）迭代器中调用cycle（），还是在带有jQuery id选择器的两个或三个容器上手动调用它，都会发生这种情况。

Answer 1

只需将其添加到您的CSS：

.column { position: relative }

Cycle插件正在幻灯片上设置absolute定位，这将与具有position: relative或position: absolute的第一个父元素相关。因此，通过在position: relative类上设置.column，它包含到其0,0坐标的幻灯片，并随后使它们不会相互重叠。