项目pather代码

//底部轮播功能
//盒子scrollRight滚动 把滚动的li 插入ul第一个子元素当中 prepend
var ulParentWidth = $('.patherBox').innerWidth();
console.log(ulParentWidth);

var lis = $('#runbox').children('li');
var lislong = lis.length;
var liWidth = lis.eq(0).outerWidth();
var t3 = 400;
var t4 = 2000;
var timerPather;
console.log(lislong*liWidth);
//滚动
//自动滚动
if(lislong*liWidth > ulParentWidth){
console.log(123);
timerPather = setInterval(function(){
$('#runbox').animate({"margin-left":"-"+liWidth},t3,function(){
$(this).css("margin-left","0").children().eq(0).appendTo($(this));
});
},t4);
}
//暂停
$('.patherBox').on({
"mouseover":function(){
clearInterval(timerPather);
},
"mouseout":function(){
if(lislong*liWidth > ulParentWidth) {
timerPather = setInterval(function () {
$('#runbox').animate({"margin-left": '-' + liWidth}, t3,function(){
$(this).css("margin-left", "0").children().eq(0).appendTo($(this));
});
}, t4);
}
}
});
//左右两边按钮
//左边
$('.glyphicon-menu-left').on({
"mouseover":function(){
clearInterval(timerPather);
},
"mouseout":function(){
if(lislong*liWidth > ulParentWidth) {
timerPather = setInterval(function () {
$('#runbox').animate({"margin-left": '-' + liWidth}, t3,function(){
$(this).css("margin-left", "0").children().eq(0).appendTo($(this));
});
}, t4);
}
},
"click":function(){
$('#runbox').animate({"margin-left": '-' + liWidth}, t3,function(){
$(this).css("margin-left", "0").children().eq(0).appendTo($(this));
});
}
});
//右边
$('.glyphicon-menu-right').on({
"mouseover":function(){
clearInterval(timerPather);
},
"mouseout":function(){
if(lislong*liWidth > ulParentWidth) {
timerPather = setInterval(function () {
$('#runbox').animate({"margin-left": '-' + liWidth}, t3,function(){
$(this).css("margin-left", "0").children().eq(0).appendTo($(this));
});
}, t4);
}
},
"click":function(){
$('#runbox').animate({"margin-left": liWidth}, t3,function(){
$(this).css("margin-left", "0").children().last().insertBefore($(this).children().first());
});
}
})
原文地址:https://www.cnblogs.com/fdxxiaobai/p/6912664.html