JQ文字向上轮播

效果前(如下图)：

效果后(如下图)：

html：

               
• 
                         
  
                             

  顶替1

  
                             

  要要1

  
                         
  
                         
  9天前
  
                 

       

要做的效果是文字向上轮播，js代码如下:

$.fn.textSlider = function(settings){
    settings = jQuery.extend({
        speed : "normal",
        line : 2,
        timer : 3000
    }, 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                 ul.find("li:first",$this).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();
};

调用：

$(document).ready(function(){
    $("#FontScroll").textSlider({line:1,speed:500,timer:2000});

//line表示的是向上滚动几行
});