tdreyno / jquery-product-slider

Apple-style project slider

This URL has Read+Write access

Thomas Reynolds (author)
Wed Nov 19 12:02:26 -0800 2008
jquery-product-slider / product-slider.js
100644 33 lines (28 sloc) 0.987 kb
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
(function($) {
  $.fn.productSlider = function() {
    var settings = $.extend($.productSlider.settings, arguments[0] || {});
    
    this.each(function() {
      var scrollable = $(this),
          viewport = scrollable.children(settings.viewport);
      
      if (scrollable.children('.ui-slider').length < 1)
        scrollable.append('<div class="ui-slider"/>');
        
      var track = scrollable.find('.ui-slider');
      track.slider({
        max: viewport.innerWidth() - scrollable.outerWidth(),
        slide: function(event, ui) {
          viewport.css('left', '-' + ui.value + 'px');
        }
      });
 
      $(settings.prev).click(function() { track.slider("moveTo", "-=" + settings.clickInc); });
      $(settings.next).click(function() { track.slider("moveTo", "+=" + settings.clickInc); });
    });
  };
  
  $.productSlider = {
    settings: {
      clickInc: 150,
      prev: '.prev',
      next: '.next',
      viewport: 'ul'
    }
  };
})(jQuery);