jquery stop on last imageフェイドイン

Question

私は3つの画像のフェードインとフェードアウトですが、最後に到着したら最後の画像に戻ります。最後の画像で停止したいです。どうすればいいですか？

$(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 
 
{ 
 
\t 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) 

} 

それは効率的ではなく、おそらくきれいではないが、動作するようです。