⿏标移⼊，暂停滚动； ⿏标移出，继续滚动；
2.原理厂房屋顶光伏发电>激光夜视仪
要实现⽆缝衔接，在原有ul后⾯还要有⼀个⼀样内容的ul；
洗手粉
最外层div为可视区域，设overflow：hidden；
2个ul的⾼度 > 外层可视div⾼度，才能滚动；
3.实现代码
html：
<!-- vue -->
<div id="review_box"@mouseover="rollStop()"@mouseout="rollStart(60)">
<ul id="comment1">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<ul id="comment2"></ul>
</div>
珠光膜css:
div{
height: 100px;/* 必须 */
overflow: hidden;/* 必须 */
}
js:
//vue data
data(){
return{
timer:null,
}
},
mounted(){
},
beforeDestroy(){
if(this.timer)clearInterval(this.timer);
},
//vue methods
roll(t){
var ul1 = ElementById("comment1"); var ul2 = ElementById("comment2"); var ulbox = ElementById("review_box"); ul2.innerHTML = ul1.innerHTML;
ulbox.scrollTop =0;
},
碱式氧化锰rollStart(t){
var ul1 = ElementById("comment1"); var ul2 = ElementById("comment2"); var ulbox = ElementById("review_box"); llStop();
this.timer =setInterval(()=>{
// 当滚动⾼度⼤于列表内容⾼度时恢复为0
if(ulbox.scrollTop >= ul1.scrollHeight){
ulbox.scrollTop =0;
}else{
ulbox.scrollTop++;
}
}, t);
},
rollStop(){
clearInterval(this.timer);
仿形切割机},
豫公网安备41160202000603
站长QQ:729038198
关于我们
投诉建议