zoukankan      html  css  js  c++  java
  • html页面js实现多个div定时轮流出现

    <style type="text/css">
    #con{ border:5px solid #ccc;padding:10px;font-size:30px;}
    .a{ border:2px solid #ccc;background-color:#eee;}
    </style>
    <div id="con"><!--外层容器-->
        <div class="a">111111</div>
        <div class="a" style="display:none">222222</div>
        <div class="a" style="display:none">333333</div>
        <div class="a" style="display:none">444444</div>
        <div class="a" style="display:none">555555</div>
        <div class="a" style="display:none">666666</div>
        <div class="a" style="display:none">777777</div>
    </div>
    <script type="text/javascript">
    <!--
    function G(e){return document.getElementById(e);}
    function myPlayer(con, child, speed){
        var ts = G(con).getElementsByTagName(child),//获取容器内需要轮流显示的子元素:这里是 div
            timer,k=0;
            var timer = setInterval(function(){//定义时间控制器
                for(var m=0;m<ts.length;m++){ts[m].style.display='none';}//先隐藏全部,此处效率降低,可以考虑不用循环
                ts[k].style.display='';//显示需要显示的
                if(k>ts.length-2){
                   k=0;
                }else{
                   k++;
                }
            },speed);
    }
    myPlayer('con','div',1000);//调用,参数一外层元素ID,参数二循环元素名称,间隔时间:秒数的1000倍
    -->
    </script>
  • 相关阅读:
    NOR flash和NAND flash区别,RAM 和ROM区别
    JPG文件结构分析
    JPG文件结构分析
    如何在cmd命令行中查看、修改、删除与添加环境变量
    如何在cmd命令行中查看、修改、删除与添加环境变量
    IJG JPEG使用说明
    IJG JPEG使用说明
    Jpeglib读取jpg文件
    Jpeglib读取jpg文件
    VS开发】C中调用C++文件中定义的function函数
  • 原文地址:https://www.cnblogs.com/lljinz/p/2068645.html
Copyright © 2011-2022 走看看