I wrote this jQuery plugin for a slider carousel. I works If there's only one unordered list on the page but if there are are than one, everything breaks. It applies the plugin to the last list on the page even though I specifically select the actual carousel list.
here's the plugin code
this is how I'm calling the pluginCode:(function($){ $.fn.ssCarousel = function(options){ var defaults = { speed: 500, leftPosition: '-300px', itemAdjust: 20 }; var options = $.extend(defaults, options); return this.each(function() { var element = $(this); var item_width = $('li', element).outerWidth() + options.itemAdjust; console.log(element); $('li', element).clone().insertAfter('li:last', element); $('li:first', element).before($('li:last', element)); $(element).parent().prev().children('img').click(function(){ var left_indent = parseInt($(element).css('left')) - item_width; $(element.not(':animated')).animate({'left' : left_indent},options.speed,function(){ $('li:last', element).after($('li:first', element)); $(element).css({'left' : options.leftPosition}); }); }); $(element).parent().next().children('img').click(function(){ var left_indent = parseInt($(element).css('left')) + item_width; $(element.not(':animated')).animate({'left' : left_indent},options.speed,function(){ $('li:first', element).before($('li:last', element)); $(element).css({'left' : options.leftPosition}); }); }); }); }; })(jQuery);
Any help with this will be appreciated.Code:<script type="text/javascript"> $('.portfolio').ssCarousel(); </script>
Thanks in advanced



Reply With Quote

Bookmarks