jQuery show a number of list items, fade them out then show some more -


I have an indexed list of thumbnail images, I say, trying to figure out how to display - Display 9 of these, then fade them down and using 9 below, etc. etc. using jQuery.

There will be a lot of pictures, so I

Two pieces of code for you:

  var show = 9; Var current = show - 1; Var length; Var Gallery = $ ('# Gallery'); Var galleryItems = Gallery. Children ('li'); Length = gallery item Length; SetInterval (function (current = (current + 1)% 60; gallery_its.ec (current). Slidedown (); gallery items.ec (current-show) .slideUp ();}, 3000);  < / Pre> 

This will turn the entire list up to one item at a time. See:


  var show = 9; var current = 0; var length; Var gallery = $ ('# Gallery'); Var Gallery Items = Gallery. Children ('Li'); Length = Gallery Item Length; SetInterval (function (for (var i = Current; i & lt; (current + show) ; I ++) {galleryItems.eq (i). FadeOut (300, function) {var idx = (galleryItems.index (this) + show)% tall ; Gallery Items.com (idx) .fadeine (300);});} current + = show; if (current> gt; length) current = 0;}, 4000);  

And it will fade and fade together with a group of items. See:

The main thing to keep in mind is that the setInterval () function, which is the function bar , And .eq (n) function, which gets the n th element of the current jQuery object


Comments