jq 自动滑动轮换(向后插入小块)
// JavaScript Document
var Marquee = {
arrIdObj : {/*marqueebox : {distance:-95,//移動(dòng)距離delay:3000,//延遲時(shí)間speed:1000//移動(dòng)時(shí)間},minCount:2 */},
//創(chuàng)建對(duì)象
startMarquee:function(){
//給參數(shù)賦值
if(this.arrIdObj != null && typeof this.arrIdObj === "object"){
for(var p in this.arrIdObj){
var obj = new classMarquee(document.getElementById(p),this.arrIdObj[p]);
}
}else{return null;}
function classMarquee(objElem,params){
var $objElem = $(objElem);
var Mparams = params;
//至少多少個(gè)
if(params.minCount > $(objElem).children().length){return null;}
//初始化
var t;
var b = false;
$objElem.mouseover(function(){b = true;});
$objElem.mouseout(function(){b = false;});
function start(){
$objElem.css("margin-top","0");
t = setTimeout(scrolling,Mparams.delay);
}
function scrolling(){
if(!b){
var styleVal = Mparams.distance +"px";
$objElem.animate({"margin-top":styleVal},Mparams.speed,"linear",function(){
$objElem.append($objElem.children()[0]);
start();
});
}else{
start();
}
}
start();
}
}
}
//自定義部分
Marquee.arrIdObj ={
marqueebox : {
distance:-95,//移動(dòng)距離
delay:3000,//延遲時(shí)間
speed:1000,//移動(dòng)時(shí)間
minCount:5
},
marqueebox1:{
distance:-121,//移動(dòng)距離
delay:3000,//延遲時(shí)間
speed:1000,//移動(dòng)時(shí)間
minCount:2
}
}
Marquee.startMarquee();
?
<ul id="marqueebox"><li></li><li></li><li></li><li></li><li></li></ul>
<ul id="marqueebox1"><li></li><li></li><li></li></ul>
轉(zhuǎn)載于:https://www.cnblogs.com/mengwei-ziyun/p/5605811.html
總結(jié)
以上是生活随笔為你收集整理的jq 自动滑动轮换(向后插入小块)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: rem 之js代码获取font-size
- 下一篇: iOS开发——处理1000张图片的内存优