在jquery-cycle2中使用data-cycle-fx =「none」時，我看到舊圖像下面的圖像在它變化之前

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> 

有沒有人知道如何避免這個問題？ 我從舊的jquery循環移動到新的，因爲當我使用fx：'none'時，我的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" 
>