jquery垂直公告滚动实现代码

最新推荐文章于 2024-09-13 07:58:47 发布

GMY20

最新推荐文章于 2024-09-13 07:58:47 发布

阅读量462

点赞数

分类专栏：脚本编程

本文链接：https://blog.csdn.net/TCS1164/article/details/17222761

版权

脚本编程专栏收录该内容

56 篇文章 0 订阅

订阅专栏

发布：whsnow 字体：[增加减小] 类型：转载
公告滚动想必大家都有见到过吧，实现方法也有很多，下面为大家介绍使用jquery实现垂直公告滚动，感兴趣的朋友不要错过
代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.7.2.js"></script>
<style>
*{
padding:0px;
margin:0px;
}
ul{
list-style:none;
}
li{
line-height:30px;
}
</style>
</head>

<body>
<ul>
<li>1111</li>
<li>22222</li>
<li>3333</li>
<li>44444</li>
<li>5555</li>
<li>66666</li>
</ul>
<script>
setInterval(function(){
var newList=$('ul :first').clone(true);
$('ul').append(newList);
$('ul :first').remove();
},2000);

</script>
</body>
</html>