任何滑块 FX 问题

Question

我正在尝试将各种 FX 与 AnySlider（在这种情况下特别是左、右和淡入淡出）一起使用并遇到一些问题。所有幻灯片都设置为“淡入淡出”FX，一切似乎都正常工作（见下面的链接）：

http://dl.dropbox.com/u/12310886/Work/anythingslider/slide_fade.html

但是，如果所有幻灯片都设置为“左”或“右”FX，则幻灯片在旋转时会不同步（请参阅下面的链接）：

http://dl.dropbox.com/u/12310886/Work/anythingslider/slide_left.htmlhttp://dl.dropbox.com/u/12310886/Work/anythingslider/slide_right.html

知道发生了什么吗？

提前致谢！

Answer 1

问题是整个面板都被动画化了。因此，当最后一个或下一个取决于方向的面板移出视图时，它实际上最终会与当前面板重叠。所以你有两个选择：

1. 将面板的内容包装在一个元素中，并将其定位为动画。这会起作用的原因是面板本身应用了overflow:hidden 属性，因此内容不会与其他面板重叠。

   <div class="left">
     <div class="content-wrapper"> <!-- add this content wrapper -->
       <div class="caption"></div>
       <img src="../slide1.jpg" alt="" />
     </div>
   </div>
   

2. 将.activePage { z-index: 1; } 添加到您的CSS。这是有效的，因为当前面板将始终位于顶部。此解决方案的主要问题是您会看到其他面板在背景中奇怪地移动。