Don't like ads? PRO users don't see any ads ;-)

jQuery slideshow

By: cacko on Apr 25th, 2012  |  syntax: jQuery  |  size: 0.93 KB  |  hits: 35  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1.                         $(document).ready(function() {
  2.                                 var nextButton = $('#slideshow .next');
  3.                                 var prevButton = $('#slideshow .previous');
  4.                                 var _timeout = 3500
  5.                                 var idx = 0;
  6.                                 var auto = true;
  7.                                 var nItems = $('div.items>div.page').size();
  8.                                 $('div.items').width(nItems * 960);
  9.                                 var slide = function(offset) {
  10.                                         idx = idx +((typeof(offset) == 'undefined') ? 1 : offset);
  11.                                         prevButton.toggle((idx > 0));
  12.                                         nextButton.toggle((nItems - 1 > idx));
  13.                                         $('div.items').animate({
  14.                                                 left : -(idx * 960),
  15.                                                 opacity : 1
  16.                                         }, 500, function() {
  17.                                                 if(auto) {
  18.                                                         if(!(nItems > idx + 1)) {
  19.                                                                 idx = -1;
  20.                                                         }
  21.                                                         timer = setTimeout(slide, _timeout);
  22.                                                 }
  23.                                         });
  24.                                 }
  25.                                 nextButton.show();
  26.                                 var timer = setTimeout(slide, _timeout);
  27.                                 $('#slideshow .navButton').click(function() {
  28.                                         clearTimeout(timer);
  29.                                         auto = false;
  30.                                         slide($(this).hasClass('next') ? 1 : -1);
  31.                                 });
  32.                         });