silver-marquee

silver-marquee

是什么

• 文字跑马灯滚动

如何使用

• 通过npm引入模块

tnpm install silver-marquee --save
// tv端,pc端,移动端
const Marquee = require('silver-marquee')('project:module')

• 或者通过js静态引入

//tv端,pc端,移动端
<script type="text/javascript" src="//g.alicdn.com/silvermine/silver-marquee/{version}/index.min.js"></script>

• 使用案例

<style>
  .hd{width: 200px;height:50px;line-height:50px;overflow: hidden;}
  .marquee{
    display: inline-block;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;
  }
</style>
<h4 class="hd"><span class="marquee">我是长长的文案，我要滚动啦～～</span></h4>

<script type="text/javascript">
  const marquee = new window.tvcnpt.Marquee();
  marquee.start(document.querySelector('.hd'));
</script>

API

• start(ele,cfg) 开始滚动

  • ele {Element} 滚动父元素，必须包含 ~ .marquee ~ 子元素
  • cfg {Object}
    • delay:500, //每次滚动延迟时间
    • interval:3 //滚动几次停止，小于等于0无限循环，默认3次

• stop(ele) 停止滚动

  • ele {Element} 滚动父元素