(function($) { $.fn.carousel = function(options) { var defaults = { prevText: 'Previous', nextText: 'Next', itemsPerSlide: 3, itemsPerAnim: 1, speed: 600 }; var options = $.extend(defaults, options); return this.each(function(i) { obj = $(this); var cls = obj.attr('class'); var id = cls + '_' + i; var controls_id = 'carousel_controls_' + i; var controls; obj.wrap('<div id="' + id + '" class="' + cls + '"></div>'); obj.removeClass(); var container = $('#' + id); var slideCount = $('li', obj).length; var w = container.width(); var totalw = w * options.itemsPerSlide; var h = obj.height(); var ts = slideCount - 1; var t = 0; container.css('width', totalw); $('ul', container).css('width', (Math.ceil(slideCount / options.itemsPerSlide) * options.itemsPerSlide + 1) * w); container.after('<div class="bp-CarouselControls" id="' + controls_id + '"><a class="prev" href=\"javascript:void(0);\">' + options.prevText + '</a> <a class="next" href=\"javascript:void(0);\">' + options.nextText + '</a></div>'); controls = carouselControls(); controls.prev.hide(); if (slideCount <= options.itemsPerSlide) controls.next.hide(); controls.next.click(function() { animate('next'); if (t * options.itemsPerAnim + options.itemsPerSlide > ts) $(this).fadeOut(); controls.prev.fadeIn(); }); controls.prev.click(function() { animate('prev'); if (t <= 0) $(this).fadeOut(); controls.next.fadeIn(); }); function animate(dir) { if (dir == 'next') { t = (t >= ts) ? ts : t + 1; } else { t = (t <= 0) ? 0 : t - 1; }; p = (t * w * options.itemsPerAnim * -1); if ((t + 1) * options.itemsPerAnim > slideCount) p = p + ((((t + 1) * options.itemsPerAnim) - slideCount) * w); $('ul', container).animate({ marginLeft: p }, options.speed); }; function carouselControls() { return { 'prev': $('#' + controls_id + ' .prev'), 'next': $('#' + controls_id + ' .next')} }; if (slideCount > 1 && slideCount > options.itemsPerSlide) $('a', '#' + options.nextId).fadeIn(); }); }; })(jQuery);