javascript - 轮播幻灯片改为移动到透明 div 后面

Question

我是 jquery 的新手，所以请多多包涵。

我已设法使以下轮播插件正常工作，但我遇到了一个小问题。每当我在幻灯片之间单击时，前一张幻灯片或将在任一方向“紧随其后”的幻灯片都会飞过当前幻灯片的背面。

如果图像完全不透明，这不会是个问题，但我使用的是透明背景，所以你真的可以注意到背后的飞舞。

我的问题 - 是否有办法禁用未显示的幻灯片的“飞越”？或者让幻灯片更谨慎地移动？

任何帮助将不胜感激...

非常感谢!

PS:这个旋转木马的所有功劳都归功于 Filament Group :)

http://jsfiddle.net/HCHS8/

<div style="margin: 0px auto;">
<center>
    <div class="carousel arrows" data-transition="slide" style="height: 300px;">
        <div>TEST SLIDE 1 Text here, but if you click to move to next slide, other slide wipes behind (if clear background)</div>
        <div>TESTING SLIDE 2</div>
</center>

Answer 1

与其尝试更改代码，不如使用简单的 CSS 解决问题。检查这个 fiddle 。我为您的类更新了一些用于非事件元素的 CSS 规则。看起来现在它正在按照您想要的方式工作。 http://jsfiddle.net/HCHS8/1/

.carousel-item-prev, .carouse-item-next {
    opacity:0;
}