简单的新闻滚动

ice-cream

这里直接用jquey的animate函数做的滚动效果
 
效果图：
 

 
 
<script type="text/javascript">     var lineHeight = 30;var time = 1500;        $(function(){           activitiesScroll();           })        function activitiesScroll(){            $("ul").hover(function(){              clearInterval(automoving);            },function(){              automoving = setInterval("Moving(lineHeight)",time)            }).trigger("mouseleave");          }        function Moving(lineHeight){          $("ul li:first").animate({marginTop:"-"+lineHeight+"px"},"slow",function(){            $(this).css("margin-top","0").appendTo($(this).parent());          });         }    </script> <style type="text/css">        *{margin:0;padding:0;}a{text-decoration:none;color:#000;}.scroll-text{background: -moz-linear-gradient(top, #fff, #ccc);width:300px;padding:50px;font-size:12px;}        ul{height:30px;line-height:30px;overflow:hidden;border:1px dashed #000;border-width:1px 0;}</style> <div class="scroll-text">  <ul><li><a href="http://ice-cream.iteye.com/blog/807041">ice-cream -- 上一张下一张</a></li><li><a href="http://ice-cream.iteye.com/blog/798083">ice-cream -- 二级菜单</a></li><li><a href="http://ice-cream.iteye.com/blog/798067">ice-cream -- 自动播放的jQuery幻灯片</a></li><li><a href="http://ice-cream.iteye.com/blog/714377">ice-cream -- IE下li内元素浮动产生边距的解决办法</a></li>  </ul></div>