跑马灯（广播消息轮播组件）

标签：amount   插件   The   lin   desc   循环   ati   无缝滚动   pre   

基于vue2的垂直跑马灯（广播消息轮播组件）

npm install vue-marquee

new Vue({
  el: ‘body‘,
  data: function(){
  	return {
  		listData: [‘item1‘, ‘item2‘, ‘item3‘]
  	}
  },
  components: {
    ‘vue-marquee‘: Marquee,
    ‘item‘: ‘你的列表item组件‘
  },
  templete: `<vue-marquee :duration="600" :interval="2000">
                <item v-for="i in listData" :content="i"></item>
             </vue-marquee>`
});

传入参数

文档原文：https://www.npmjs.com/package/vue-marquee

注：用vue做出来的滚动时有点卡顿

基于jq的跑马灯（广播消息轮播组件）

1、引入文件

<link rel="stylesheet" href="/css/liMarquee.css">
<script src="/js/jquery-1.9.0.min.js"></script>
<script src="/js/jquery.liMarquee.js"></script>

2、HTML

<div class="dowebok">jQuery无缝滚动插件liMarquee</div>

3、JavaScript

$(function(){
    $(‘.dowebok‘).liMarquee();
});

传入参数

跑马灯（广播消息轮播组件）

标签：amount   插件   The   lin   desc   循环   ati   无缝滚动   pre   

原文地址：https://www.cnblogs.com/ljyyjj/p/14504601.html