vue+element⾃动循环滚动列表核⼼代码：
<div ><img src="imgs/right_icon_map_sel2.png"
><span
class="tit">实时动态</span></div>
<div ref="message" class="messages">
<div ref="infobord1" v-for="item in timelineData" :key="item.time">
<div >
<p >{{item.time}}</p>
<p >{{pe}}</p>
</div>
<p>{{item.name}}</p>
</div>
</div>
rollText: function() {
var speed = 30; //滚动速度
var that = this;
function Marquee() {
var div = ElementsByClassName("messages")[0];
//当滑动到最底部时⾃动回到顶部
if (ssage.scrollTop == (div.scrollHeight-div.clientHeight)) {
} else {
// console.ssage.scrollTop);
// console.log(that.infobord1.offsetTop);
}
}
var MyMar = setInterval(Marquee, speed); //设置定时器
//⿏标移上时清除定时器达到滚动停⽌的⽬的
clearInterval(MyMar);
});
//⿏标移开时重设定时器
marquee marquee
MyMar = setInterval(Marquee, speed);
});
}
/*动态滚动事件列表*/
.messages {
position: relative;
width: 90%;
margin: 1% 5%;
height: 90%;
overflow: auto;
}
原理就是控制滚动条的定时移动

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。