一款同时兼容PC与手机端的vue.js动态数据滚动文字公告代码,文字向上滚动切换效果。
js代码
<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript">
const vm = new Vue({
el: ".vueBox",
data: {
animate: false,
marqueeList: [
{
name: '1军',
city: '北京',
amount: '10'
},
{
name: '2军',
city: '上海',
amount: '20'
},
{
name: '3军',
city: '广州',
amount: '30'
},
{
name: '4军',
city: '重庆',
amount: '40'
}
]
},
created: function () {
setInterval(this.showMarquee, 2000)
},
methods: {
showMarquee: function () {
this.animate = true;
setTimeout(()=>{
this.marqueeList.push(this.marqueeList[0]);
this.marqueeList.shift();
this.animate = false;
},500)},
}
});
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791