移动端的数据滚动插件

var DataScroll = function(){

var list = null;    //滚动的列表
var parent = null;  //列表的父节点
var speed = null;   //滚动的速度
var listHeight = null;   //列表的高度
var self = this;

//初始化数据
this.init = function(obj)
{
//插入数据
$(obj['list']).parent().append( $(obj['list']).clone(true) );

$(function(){

list = obj['list'];
parent = $(obj['list']).parent();
speed = $(list).children().length;
listHeight = parseInt($(list).css('height'));
self.startAnimation();

});
},

//开始滚动
this.startAnimation = function()
{
var movelist = parent.children();
for(var i=0; i<movelist.length; i++)
{
var mlist = movelist[i];
$(mlist).attr('num', i);
mlist.style.webkitTransform = 'translateY(0px)';

//设置动画时间
mlist.style.webkitTransition = 'all '+(i==0? speed : speed * 2)+'s linear 0s';

//设置滚动位置
mlist.style.webkitTransform = 'translateY(-'+(i==0? listHeight : listHeight * 2)+'px)';

//滚动完成后的回调函数
mlist.addEventListener('webkitTransitionEnd', function(){

var num = parseInt($(this).attr('num'));
var selfM = this;

//停止动画时间
selfM.style.webkitTransition = 'all 0s linear 0s';

//设置位置为最下面
selfM.style.webkitTransform = 'translateY('+( num==0? listHeight : 0)+'px)';

//再次开启动画
setTimeout(function(){
selfM.style.webkitTransition = 'all '+speed*2+'s linear 0s';
selfM.style.webkitTransform = 'translateY(-'+(num==0? listHeight : listHeight * 2)+'px)';
},10);
});
}
}
}

new DataScroll().init({
list : '#msg'  //滚动列表的id
});