//html
{{item}}//css
.box{
height:40px;
line-height:40px;
overflow:hidden;
position:relative;
}
.list{
position:absolute;
left:0;
}
//js
data(){
return{
list:[1111,2222,3333],
listTop:0,
}
},
mounted(){
this.setScroll();
},
methods:{
setScroll(){
vart=setInterval(()=>{
this.listTop-=1;
if(this.listTop===-40){
this.list.push(this.list.splice(0,1)[0]);//删除数组第一个元素,插入到数组后面
this.listTop=0;//重置top
clearInterval(t);//取消定时器
//设置一个2秒后执行的定时器,重新开启滚动
setTimeout(()=>{
this.setScroll();
},2000)
}
},20)
}
}
|