Question

我有这个img幻灯片，当我点击时会改变。我希望当图像改变时没有任何效果，就像它曾经在旧的jquery循环中一样，但是我得到了一个奇怪的效果，两个图像相互重叠，直到第二个最终出现，然后第一个消失。

        <div class="imgCyclerBody">
            <div><a href="#" class="prev"><img class="sortArrow" src="~/Content/imgs/arrow-left.png" alt="left"/></a></div>
            <div id="slideshow" class="cycle-slideshow" data-cycle-fx="none" data-cycle-hide-non-active="true" data-cycle-prev=".prev" data-cycle-next=".next">
                <img alt="Item" src="~/Content/imgs/image1.png" width="30" height="30" />
                <img alt="Item" src="~/Content/imgs/image2.png" width="30" height="30" />
                <img alt="Item" src="~/Content/imgs/image3.png" width="30" height="30" />
                <img alt="Item" src="~/Content/imgs/image4.png" width="30" height="30" />
                <img alt="Item" src="~/Content/imgs/Pixels.png" width="30" height="30" />
            </div>
            <div><a href="#" class="next"><img class="sortArrow" src="~/Content/imgs/arrow-right.png" alt="right"/></a></div>
        </div>

有人知道如何避免这个问题吗？当我使用fx：'none'时，我从旧的jquery循环移动到新的jquery循环，因为我的DIV格式有问题。感谢

Answer 1

您是否尝试过使用easing插件？

我的fiddle.

似乎没有问题

<div class="cycle-slideshow" 
  data-cycle-slides="li" 
  data-cycle-fx='none' 
  data-cycle-speed='700' 
  data-cycle-timeout='7000' 
  data-cycle-pause-on-hover="true" 
  data-cycle-prev=".prev" 
  data-cycle-next=".next"     
  data-cycle-easing="easeOutBack"
>

在jquery-cycle2中使用data-cycle-fx =“none”时，我看到旧图像之前的图像在更改之前

1 个答案: