vue实现消息的无缝滚动效果的示例代码

前端之家收集整理的这篇文章主要介绍了vue实现消息的无缝滚动效果的示例代码前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

朋友的项目里要实现一个消息无缝滚动的效果,中途遇到了一点小bug,每组消息滚动完再次循环时会出现停留两倍的时间间隔问题,我研究了一天终于解决了这个1S的小问题

项目环境vue-cli ,请自行配置好相应的,环境及路由,这里主要介绍实现的方法

第一步在模板中 使用v-for方法循环出消息列表

<div id="Box">
<ul id="con1" ref="con1" :class="{anim:animate==true}">

  • {{item.name}}
  • 第二步在

    以上就是这篇文章的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

    原文链接:https://www.f2er.com/vue/34878.html

    猜你在找的Vue相关文章