2017-02-12 7 views
0

セットアップは、次のボタンと前のボタンでスライドショーのセットアップを開始しましたが、動作していないようです。終了していませんが、次のボタンと前のボタンが機能するはずです。jQueryスライドショー(前後)

var timer; 
    var slides = 5; 
    var timeLen = 5000; 

    function nextSlide(){ 
     clearTimeout(timer); 
     var current= parseInt($("#counter").html()); 

     if(current < slides){ 
      var nextSlide = current + 1; 
     } else { 
      var nextSlide = 1; 
     } 

     // set rear image to next slide 
     $("#slide_back img").attr("src","http://daduber.com/ss2/" + nextSlide + ".jpg"); 

     // hide front image 
     $("slide_front").animate({opacity: "0"},700,"linear",function(){ 

     // change front image src(currently hidden) 
     $("#slide_front img").attr("src","http://daduber.com/ss2/" + nextSlide + ".jpg"); 
     $("slide_front").animate({opacity: "0"}, 700, "linear", function(){ 
     // display front image 
     $("#slide_front").css("opacity","1"); 

     // change jumpers 
     $("#jumpers li.current").removeAttr("class"); 
     $("#jumpers #" + nextSlide).attr("class","current"); 

     // update counter 
     $("#counter").html(nextSlide); 

     // set timer for next image 
     timer = setTimeout("nextSlide()", timeLen); 

    }); 

    } 

    $(document).ready(function(){ 
     timer = setTimeout("nextSlide()", timeLen); 
    }); 

jsfiddle.net

それは私にはアニメーションのコールバック機能付きのものを思わ。 $( "slide_front")。animate({opacity: "0"}、700); と置き換えてください。 それは私がアニメーションを変更することにより、それを修正することができましたアニメーション

答えて

0

せずに動作します:

$("#slide_front").animate(
    {'opacity':'0', 
    duration:700, easing:"linear"}, 
    function(){ 
関連する問題