jquery新闻上下滚动超简洁

最新推荐文章于 2021-08-21 17:49:46 发布

ke0971

最新推荐文章于 2021-08-21 17:49:46 发布

阅读量1.4k

点赞数

分类专栏： HTML 文章标签： jquery

HTML 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

http://www.jq22.com/webqd74

<!DOCTYPE html>
<html lang="en">
 <head> 
  <meta charset="UTF-8" /> 
  <meta name="Generator" content="EditPlus&reg;" /> 
  <meta name="Author" content="" /> 
  <meta name="Keywords" content="" /> 
  <meta name="Description" content="" /> 
  <title>Document</title> 
  <style type="text/css">
    li{ list-style-type: none; }
  </style> 
  <script type="text/javascript">
    function AutoScroll(obj) {
        $(obj).find("ul:first").animate({
            marginTop: "-22px"
        },
        500,
        function() {
            $(this).css({
                marginTop: "0px"
            }).find("li:first").appendTo(this);
        });
    }
    $(document).ready(function() {
        setInterval('AutoScroll("#demo")', 1000)
    });
</script> 
 </head> 
 <body> 
  <div id="broadcast" class="bar" name="giftactive"> 
   <div style="float:left">
    <strong>间隔滚动效果：</strong>
   </div> 
   <div id="demo" style="overflow:hidden;height:22px;line-height:22px;"> 
    <ul class="mingdan" id="holder"> 
     <li><a href="#" target="_blank">aaaaaa</a></li> 
     <li><a href="#" target="_blank">bbbbbb</a></li> 
     <li><a href="#" target="_blank">cccccc</a></li> 
     <li><a href="#" target="_blank">dddddd</a></li> 
     <li><a href="#" target="_blank">eeeeee</a></li> 
    </ul> 
   </div> 
  </div>   
 </body>
</html>

ke0971

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery新闻上下滚动超简洁

http://www.jq22.com/webqd74<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="Generator" content="EditPlus®" /> <meta name="Author" content="" /> <meta name="
复制链接

扫一扫