JQuery左右滚动插件

(function($) { 
	   $.fn.extend({ 
		     roll: function(options) { 
		    	   var defaults = {speed:1};
		    	   var options = $.extend(defaults, options);
		    	   var speed=(document.all) ? options.speed : Math.max(1,options.speed-1);
		    	   var $container = $(this).parent();
		    	   var $content = $(this);
		    	  
	    	   	   var init_left = $content.position().left;
		    	   $content.css({left:parseInt(init_left) + "px"});
		    	   var self = this;
                   var time = setInterval(function(){self.move($container,$content,speed,options);},20); 
                   $container.bind("mouseover",function(){
                	  clearInterval(time);
                   });
                   $container.bind("mouseout",function(){
                	  time = setInterval(function(){self.move($container,$content,speed,options);},20);
                   });
                   return this;   
             },
	        move:function($container,$content,speed,options){
		      	  var container_width = $container.width();
		      	  var content_width = $content.width();
		      	  if(options.direction == 'left'){
		      		 if (parseInt($content.css("left")) + content_width > 0){
			      		  $content.css({left:parseInt($content.css("left")) - speed + "px"});
			      	  } else {
			      		  $content.css({left:parseInt(container_width-content_width-10) + "px"});
			      	  }
		      	  }else if(options.direction == 'right'){
		      		  if(parseInt($content.css("left")) < container_width){
		      			  $content.css({left:parseInt($content.css("left")) + speed + "px"});
		      		  }else{
		      			  $content.css({left:parseInt(0) + "px"});
		      		  }
		      	  }
		      	 
		      	  
		      	  
		    }
       });
})(jQuery);

使用方法如下

$(".scroll").roll({speed:2,direction:'left'});