html无缝滚动marquee,jquery 模拟marquee无缝滚动
(function($){
$.fn.kxbdMarquee=function(options){varopts=$.extend({},$.fn.kxbdMarquee.defaults, options);returnthis.each(function(){var$marquee=$(this);//滚动元素容器var_scrollObj=$marquee.get(0);//滚动元素容器DOMvarscrollW=$marquee.width();//滚动元素容器的宽度varscrollH=$marquee.height();//滚动元素容器的高度var$element=$marquee.children();//滚动元素var$kids=$element.children();//滚动子元素varscrollSize=0;//滚动元素尺寸var_type=(opts.direction=='left'||opts.direction=='right')?1:0;//滚动类型，1左右，0上下//防止滚动子元素比滚动元素宽而取不到实际滚动子元素宽度$element.css(_type?'width':'height',10000);//获取滚动元素的尺寸if(opts.isEqual) {
scrollSize=$kids[_type?'outerWidth':'outerHeight']()*$kids.length;
}else{
$kids.each(function(){
scrollSize+=$(this)[_type?'outerWidth':'outerHeight']();
});
}//滚动元素总尺寸小于容器尺寸，不滚动if(scrollSize0) {
numMoved+=opts.scrollAmount;if(numMoved>scrollSize*opts.loop){
_scrollObj[_dir]=0;returnclearInterval(moveId);
}
}if(opts.direction=='left'||opts.direction=='up'){
_scrollObj[_dir]+=opts.scrollAmount;if(_scrollObj[_dir]>=scrollSize){
_scrollObj[_dir]=0;
}
}else{
_scrollObj[_dir]-=opts.scrollAmount;if(_scrollObj[_dir]<=0){
_scrollObj[_dir]=scrollSize;
}
}
}//滚动开始varmoveId=setInterval(scrollFunc, opts.scrollDelay);//鼠标划过停止滚动$marquee.hover(function(){
clearInterval(moveId);
},function(){
clearInterval(moveId);
moveId=setInterval(scrollFunc, opts.scrollDelay);
}
);
});
};
$.fn.kxbdMarquee.defaults={
isEqual:true,//所有滚动的元素长宽是否相等,true,falseloop:0,//循环滚动次数，0时无限direction:'left',//滚动方向，'left','right','up','down'scrollAmount:1,//步长scrollDelay:20//时长};
$.fn.kxbdMarquee.setDefaults=function(settings) {
$.extend( $.fn.kxbdMarquee.defaults, settings );
};
})(jQuery);