JavaScript实现的滚动公告效果[基于jQuery]

本文描述了用JavaScript实现的滚动公告。分享给大家参考，如下：

今天给大家分享一个滚动公告的特效。

渲染：

代码：

！doctype html lang=' en ' head meta charset=' utf-8 ' title滚动公告/title脚本src=' http :http://libs . Baidu.com/jquery/2 . 0 . 0/jquery . min . js '/script style body { margin 336020 px；} ul { width:200px列表样式类型：无；border:1px纯红；} li { height:30px行高： 30px }/样式/头体ul Li我是第1个公告/li li我是第2个公告/li li我是第4个公告/li li我是第5个公告/li li我是第6个公告/li li我是第7个公告/li li我是第8个公告/Li Li我是第9个公告/Li Li我是第10个公告/li /ul/bodyscript //使用计时器执行函数setinterval(function(){ $(' ul 3360 first ')。克隆(真)。appendo(' ul ')每秒一次；//复制一个新节点并将其添加到ul $('ul:first ')。移除()；//删除原节点}，1000)；/script/html页面中有一个ul。首先，写一个定时器，每秒执行一次函数。在函数中，复制ul中的第一个条目，并将其添加到ul的底部。最后，删除原始条目。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun来测试上述代码的运行效果。

更多对jQuery感兴趣的读者可以查看本网站的主题：《jQuery页面元素操作技巧汇总》、《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》和《jquery选择器用法总结》

希望本文对大家的jQuery程序设计有所帮助。