(function($){
$.fn.myScroll = function(options){
//默认配置
var defaults = {
speed:40, //滚动速度,值越大速度越慢(定时器设置的时间)
rowHeight:24 //每行的高度
};
var opts = $.extend({}, defaults, options);
var intId = [];
function marquee(obj, liHeight){
obj.find("ul").animate({
marginTop: '-=1'
},0,function(){
var ulMargintop = Math.abs(parseInt($(this).css("margin-top")));
// $(this)指的是ul
if(ulMargintop >= liHeight){
$(this).find("li").slice(0, 1).appendTo($(this));
//将第一个li元素截取追加到ul末尾
//(appendTo方法:如果是已存在的元素,它将从当前位置被移除,并在被选元素的结尾被插入)
$(this).css("margin-top", 0);
}
});
}
// this表示ul父盒子
this.each(function(i){
var liHeight = opts["rowHeight"];
var speed = opts["speed"];
var _this = $(this);// this表示ul父盒子
console.log(i);
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this, liHeight);
}
}, speed);
//鼠标hover时清除定时器,移开继续
_this.hover(function(){
clearInterval(intId[i]);
},function(){
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this, liHeight);
}
}, speed);
});
});
}
})(jQuery);
网友评论