JS 跑马灯效果实现

匿名 (未验证) 提交于 2019-12-03 00:22:01

实现跑马灯效果的JS很多,但是很多不好用,下面介绍一个比较好用的。

好用之处在于:

1 支持一个页面多个跑马灯效果

2.支持跑马灯内容的异步加载

关键的实现代码,如果看不懂,可以跑这个列子

<body>
<ul id="RunTopic">
<li>文字1</li>
<li>文字2</li>
<li>文字3</li>
<li>文字4</li>
<li>文字5</li>

</ul>
<br>
<input type="button" onclick="test();" value="test">
<script type="text/javascript">
function test()
{
$("#RunTopic").find("li:first").appendTo($("#RunTopic"));
}
</script>
</body>

另外,也可以使用HTML的marquee 标签,我刚测试而来下,chrome,IE8,火狐都支持!

如:












########################################################################################


JS代码:































HTML代码:





















易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!