循环滚动

单行滚动

<div class="ui-scroll">
<ul class="ui-list">
<li><a href="#">1、每个人都有一个死角, 自己走不出来,别人也闯不进去。</a></li>
<li><a href="#">2、我把最深沉的秘密放在那里。</a></li>
<li><a href="#">3、你不懂我,我不怪你。</a></li>
<li><a href="#">4、每个人都有一道伤口, 或深或浅,盖上布,以为不存在。</a></li>
</ul>
</div>

双行滚动

<div class="ui-scroll" data-line="2" data-time="4">
<ul class="ui-list">
<li><a href="#">1、每个人都有一个死角, 自己走不出来,别人也闯不进去。</a></li>
<li><a href="#">2、我把最深沉的秘密放在那里。</a></li>
<li><a href="#">3、你不懂我,我不怪你。</a></li>
<li><a href="#">4、每个人都有一道伤口, 或深或浅,盖上布,以为不存在。</a></li>
</ul>
</div>

图片滚动

<div class="ui-scroll" data-ul=".pic" data-li=".item" data-time="5" data-height="320px">
<div class="pic">
<div class="item up">
<img src="/upfile/1.jpg" width="260" height="160" alt="">
</div>
<div class="item up">
<img src="/upfile/2.jpg" width="260" height="160" alt="">
</div>
<div class="item up">
<img src="/upfile/3.jpg" width="260" height="160" alt="">
</div>
</div>
</div>

左右滚动

<div class="ui-scroll" data-ul=".pic" data-li=".item" data-line="1" data-max="4" data-time="5" data-align="left">
<div class="pic">
<div class="item left">
<img src="/upfile/1.jpg" width="260" height="160" alt="">
</div>
<div class="item left">
<img src="/upfile/2.jpg" width="260" height="160" alt="">
</div>
<div class="item left">
<img src="/upfile/3.jpg" width="260" height="160" alt="">
</div>
<div class="item left">
<img src="/upfile/4.jpg" width="260" height="160" alt="">
</div>
</div>
</div>

参数说明

参数 默认值 是否必须 参数说明
data-line 1 滚动的行数
data-time 5 滚动的时间间隔,单位:秒
data-ul 图片滚动使用,外层元素
data-li 图片滚动使用,每一列循环元素
data-height 图片滚动使用,滚动的高度
data-align up 图片滚动使用,滚动的方向,可选值:left
data-max 1 图片滚动使用,滚动的数量