具有时间间隔的新闻上下滚动代码:
滚动代码有多种多样，比如很像和纵向连续无缝滚动，但是总感觉无缝滚动对于新闻列表这样的有所欠缺，如果滚动的时候有一定的时间间隔的话就更为人性化了，下面就简单介绍一下如何实现此种效果。
代码如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>具有时间间隔的新闻上下滚动代码</title> <script type="text/javascript" src="http://www.softwhy.com/mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> function AutoScroll(obj){ $(obj).find("ul:first").animate({ marginTop:"-25px" },500,function(){ $(this).css({marginTop:"0px"}).find("li:first").appendTo(this); }); } $(document).ready(function(){ setInterval('AutoScroll("#scrollDiv_keleyi_com")',3000); }); </script> <style type="text/css"> .scrollDiv { height:25px;/* 必要元素 */ width:200px; line-height:25px; border:#ccc 1px solid; overflow:hidden;/* 必要元素 */ margin:0px auto; } .scrollDiv li { height:25px; padding-left:10px; } ul, li { list-style-type:none; margin:0px; } </style> </head> <body> <div id="scrollDiv_keleyi_com" class="scrollDiv"> <ul> <li><a href="#">蚂蚁部落欢迎您</a></li> <li><a href="#">只有奋斗才会有美好的明天</a></li> <li><a href="#">想要做的事情要马上着手</a></li> <li><a href="#">奋斗精神和互助胸怀能够成就一个人</a></li> </ul> </div> </body> </html>
以上代码实现了我们想要的结果，新闻标题可以不间断滚动，但是有一定的时间间隔，能够让浏览者有时间仔细浏览，更为人性化。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=8039
更多内容可以参阅:http://www.softwhy.com/jquery/