1. 程式人生 > >jquery無縫滾動文字

jquery無縫滾動文字

$(document).ready(function(){ $("#scrollDiv").textSlider({line:1,speed:500,timer:3000}); }); (function($){ $.fn.textSlider = function(settings){ settings = jQuery.extend({ speed : "normal", line : 2, timer : 1000 }, settings); return this
.each(function() { $.fn.textSlider.scllor( $( this ), settings ); }); }; $.fn.textSlider.scllor = function($this, settings){ var ul = $( "ul:eq(0)", $this ); var timerID; var li = ul.children(); var liHight=$(li[0]).height(); var upHeight=0
-settings.line*liHight;//滾動的高度; var scrollUp=function(){ ul.animate({marginTop:upHeight},settings.speed,function(){ for(i=0;i<settings.line;i++){ ul.find("li:first").appendTo(ul); } ul.css({marginTop:0}); }); }; var
autoPlay=function(){ timerID = window.setInterval(scrollUp,settings.timer); }; var autoStop = function(){ window.clearInterval(timerID); }; //事件繫結 ul.hover(autoStop,autoPlay).mouseout(); }; })(jQuery);