jQuery幻燈片更改索引和淡出 - 跳躍

我正在jQuery幻燈片插件工作。我的一種方法涉及在圖片之間來回切換。我一直在創造它非常成功，這裏是一個孤立的事件的代碼迄今的特定方法：jQuery幻燈片更改索引和淡出 - 跳躍

var images = $("#simpleslides").children("img"); 

$(".slideButtons ul li").on("click", "a", function() { 

     var anchorIndex = $(this).parent().index(); 
     var $activeSlide = $("#simpleslides img:visible"); 
     var $targetSlide = $(images[anchorIndex]); 

     if($activeSlide.attr("src") == $targetSlide.attr("src") || $targetSlide.is(":animated")) { 

      return false; 

     } else { 

      $activeSlide.css({ "z-index" : 0 }); 
      $targetSlide.css({ "z-index" : 1 }); 

      $targetSlide.stop().fadeIn("slow", function() { 

       $activeSlide.hide(); 

      }); 

     } 

    });

這裏是一個小提琴看到它在工作的行動：http://jsfiddle.net/ase3E/

對於大多數部分，這可以像你期望的那樣工作。當用戶點擊相應的號碼時，它會淡入圖片中。

但是，當我快速點擊時，我遇到了一些跳動，偶爾會出現完整的幻燈片hide。如果您使用小提琴演奏，您會看到我所指的內容。嘗試點擊每張圖片以查看。

我已採用stop，我認爲這會解決問題，但沒有。我已經在fadeIn回撥之後插入hide方法，但那也沒有幫助。

我在做什麼錯在這裏？

來源

2013-02-24 Sethen

......對不起，這裏是插件？ – 2013-02-24 22:00:30

我還沒有把這個插入到插件中。這是孤立的情況，但功能完全相同。 – Sethen 2013-02-24 22:01:18

LIVE DEMO :)

var images = $("#simpleslides").find("img"); 
$(".slideButtons ul").on("click", "li", function(e) { 
    e.preventDefault(); 
    var i = $(this).index(); 
    images.eq(i).stop().fadeTo(500,1).siblings('img').fadeTo(500,0); 
});

來源

2013-02-24 22:06:16

jQuery幻燈片更改索引和淡出 - 跳躍

回答

相關問題