博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

jQuery新闻循环滚动.

Posted on 2009-04-21 00:12  linFen  阅读(3014)  评论(0编辑  收藏  举报

<script type = "text/javascript">
function scroll_news(){
    var firstNode = $('#scroll-container li'); //获取li对象
    firstNode.eq(0).fadeOut('slow',function(){ //获取li的第一个,执行fadeOut,并且call - function.
     $(this).clone().appendTo($(this).parent()).show('slow'); //把每次的li的第一个 克隆,然后添加到父节点 对象。
     $(this).remove();//最后  把每次的li的第一个 去掉。
  });//注意哦,这些都是在fadeOut里面的callback函数理执行的。
}
setInterval('scroll_news()',500);//每隔0.5秒,执行scroll_news()
</script>

 

body:

程序代码 程序代码
<div id="scroll-container" style="height: 18px;width:200px; background-color: #99CCFF; overflow: hidden;">
  <li>1111111111111111111</li>
  <li>2222222222222222222</li>
  <li>333333333333333333333</li>
  <li>44444444444444 </li>
  <li>55555555555555555555555</li>
</div>