其他代码
简单跑马灯式滚动新闻jQuery插件
PetitQ
Smart Marquee 是一款简单实用的跑马灯式滚动新闻 jQuery 插件。该插件可以在水平或垂直方向上滚动一个列表中的内容，制作类似跑马灯的效果。并可以设置循环模式，鼠标移动到列表项时会暂停新闻列表的滚动。这个插件适用于制作滚动新闻，滚动文字，滚动图片等效果。
使用方法:
使用该滚动新闻插件需要引入 jQuery 和 jquery.smartmarquee.js 文件。
也想出现在这里？联系我们吧
<script src="js/jquery.min.js"></script>
<script src="jquery.smartmarquee.js"></script>
HTML 结构:
该滚动新闻的 HTML 结构使用一个[div]作为包裹元素，里面放置一个无序列表。
<div class="smartmarquee example">
<ul class="container">
<li> Item 1 </li>
<li> Item 2 </li>
<li> Item 3 </li>
<li> Item 4 </li>
<li> Item 5 </li>
<li> Item 6 </li>
</ul>
</div>
CSS 样式:
需要为该滚动新闻添加一些必要的 CSS 样式。
.smartmarquee {
position: relative;
overflow: hidden;
}.smartmarquee .container { position: absolute; }
初始化插件:
在页面 DOM 元素加载完毕之后，可以通过 smartmarquee()方法来初始化该滚动新闻插件。
$(document).ready(function () {
$(".example").smartmarquee();
});
配置参数:
下面是该滚动新闻插件的可用配置参数。
duration：滚动动画的持续时间，单位毫秒，默认值为 1000
loop：是否循环显示，默认值为 true
interval：滚动的间隔时间，单位毫秒，默认值 2000
axis：滚动的方向，可选值有：'vertical' 或 'horizontal'
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
