Loop between images


/ Published in: jQuery
Save to your folder(s)

Endless loop between 3 images


Copy this code and paste it in your HTML
  1. $('document').ready(function() {
  2.  
  3. var $imgs = $('#slideshow > img'), current = 0;
  4.  
  5. var nextImage = function() {
  6. if (current >= $imgs.length) current = 0;
  7. $imgs.eq(current++).fadeIn(function() {
  8. $(this).delay(3000).fadeOut(nextImage);
  9. })
  10. };
  11. nextImage();
  12.  
  13. });
  14.  
  15.  
  16. HTML
  17.  
  18. <div id="slideshow">
  19. <img src="<?=$this->staticPath?>/img/girl01.jpg">
  20. <img src="<?=$this->staticPath?>/img/girl02.jpg">
  21. <img src="<?=$this->staticPath?>/img/girl03.jpg">
  22. </div>
  23.  
  24.  
  25. CSS
  26.  
  27. #slideshow img {
  28. display: none;
  29. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.