如何在大屏项目上面自己写一个竖屏滚动轮播效果

只需要分以下几部分就可以实现功能如下:
1.正常描写静态样式后调入接口
如何在大屏项目上面自己写一个竖屏滚动轮播效果
2.在data里面自定变量接下来会用到,如果你不是子组件的话props可以忽略如何在大屏项目上面自己写一个竖屏滚动轮播效果
3.第三部重点代码,此时注意最外层DIV一定要给一个高度并且设置溢出隐藏。
如何在大屏项目上面自己写一个竖屏滚动轮播效果
最后贴代码:
data属性里面
scroll: -1, //定时器中使用。当表格滚动完了自动从第一条数据开始重复滚动
speed: 100, //定时器执行时间间隔
myInterval: “”, //设置定时器
在mounted里面别忘了开始方法
mounted() {
this.init();
},
清除定时
beforeDestroy() {
clearInterval(this.myInterval);
},
方法
methods:{
init() {
mydemo2.innerHTML = mydemo01.innerHTML;
this.myInterval = setInterval(this.Marquee, this.speed); //设置定时器并赋值给myInterval
},
Marquee() {
if (mydemo2.offsetTop <= myleftdemo.scrollTop) {
myleftdemo.scrollTop -= mydemo01.offsetHeight;
} else {
if (this.scroll !== myleftdemo.scrollTop) {
this.scroll = myleftdemo.scrollTop;
myleftdemo.scrollTop++;
} else {
myleftdemo.scrollTop = 0;
this.scroll = -1;
}
}
},
// 回滚
mouseout1() {
this.myInterval = setInterval(this.Marquee, this.speed);
},
// 表格滚动开始
datashubiao() {
clearInterval(this.myInterval);
},
}