// JavaScript Document
var Marquee = {
arrIdObj : {/*marqueebox : {distance:-95,//移動距離delay:3000,//延遲時間speed:1000//移動時間},minCount:2 */},
//創建對象
startMarquee:function(){
//給參數賦值
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;
//至少多少個
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,//移動距離
delay:3000,//延遲時間
speed:1000,//移動時間
minCount:5
},
marqueebox1:{
distance:-121,//移動距離
delay:3000,//延遲時間
speed:1000,//移動時間
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>

轉載于:https://www.cnblogs.com/mengwei-ziyun/p/5605811.html

總結

以上是生活随笔為你收集整理的jq 自动滑动轮换（向后插入小块）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。