超简单的文字轮播

这是一段耐人寻味的代码，当然了你想看就看，不想看就直接跳过。两分钟即可写出文字轮播，因为这是封装的一个js文件，主要是使用简单。。。。

$.fn.extend({
    Scroll: function(opt, callback) {
        //参数初始化
        if (!opt) var opt = {};
        var _this = this.eq(0).find("ul:first");
        var lineH = _this.find("li:first").height(), //获取行高
            line = opt.line ? parseInt(opt.line, 10) : parseInt(this.height() / lineH, 10), //每次滚动的行数，默认为一屏，即父容器高度
            speed = opt.speed ? parseInt(opt.speed, 10) : 500, //卷动速度，数值越大，速度越慢（毫秒）
            timer = opt.timer ? parseInt(opt.timer, 10) : 3000; //滚动的时间间隔（毫秒）

        if (line == 0) line = 1;
        var upHeight = 0 - line * lineH;
        //滚动函数
        scrollUp = function() {
            _this.animate({
                marginTop: upHeight
            }, speed, function() {
                for (i = 1; i <= line; i++) {
                    _this.find("li:first").appendTo(_this);
                }
                _this.css({
                    marginTop: 0
                });
            });
        }
        //鼠标事件绑定
        _this.hover(function() {
            clearInterval(timerID);
        }, function() {
            timerID = setInterval("scrollUp()", timer);
        }).mouseout();
    }
})
$(function() {
    $('#text_move').Scroll({
        line: 1,
        speed: 800,
        timer: 2000
    });
});

下面是thml部分

复制成单独的js文件，项目中引入，只需改红色部分即完成

<div id='text_move'>
            <ul>
                <li>我是一段文字</li>
                <li>哈哈哈</li>
                <li>啦啦啦</li>
            </ul>
        </div>

敲黑板，id名字与js文件中的应相对应，然后在里面引入这个js文件和jquery,注意css中别忘了给text_move一个高和overflow:hidden,