jQuery停止上一个图像淡入

Question

I am doin fadeIn and FadeOut of three images.but when it arrives the last one it returns to the first.I want to stop on the last image.how can I do that?

 $(document).ready(function(){ // run every 7s setInterval('raiseToSunrise()', 1000); }); function raiseToSunrise(){ var $active = $('#layout .active'); //var $next = ($active.next().length > 0) ? $active.next() : $('#layout img:first'); var $next = $active.next(); console.log($active.next().length); $next.css('z-index',1);//move the next image up the pile $active.fadeOut(8000,function(){//fade out the top image $active.css('z-index',0).show().removeClass('active');//reset the z-index and unhide the image $next.css('z-index',2).addClass('active');//make the next image the top one }); } 

 #layout { position:relative; width:100%; margin:0 auto; } #layout img { position:absolute; width:100%; z-index:0; } #layout img.active { z-index:2; } 

 <div id="layout"> <img class="active" id="nightimg" src="TemplateData/images/img_background_night.jpg" alt="myImage"/> <img id="sunriseimg" src="TemplateData/images/img_background_sunrise.jpg" alt="myImage" /> <img id="dayimg" src="TemplateData/images/img_background_day.jpg" alt="myImage"/> </div> 

Answer 1

$(document).ready(function(){
  // run every 7s
  raiseToSunrise(8000)
});
function raiseToSunrise(interval){
  var num = 1;
  var theinterval = setInterval(function() {

    var $active = $('#layout .active');
    //var $next = ($active.next().length > 0) ? $active.next() : $('#layout img:first');
    var $next = $active.next();
    console.log($active.next().length);

    $next.css('z-index',1);//move the next image up the pile

    $active.fadeOut(8000,function(){//fade out the top image
      $active.css('z-index',0).show().removeClass('active');//reset the z-index and unhide the image
      $next.css('z-index',2).addClass('active');//make the next image the top one
    });
    num = num+1;
    if(num == 4){
      clearInterval(theinterval);
    }
  }, interval)

}

It's not pretty and probably not efficient, but it seems to work.