• javascript实现简单的轮播图片


    方法一:

     <script>
    var curIndex=0;//时间间隔(单位毫秒),每秒钟显示一张,数组共有5张图片放在Photos文件夹下。
    var timeInterval=1000;
    var arr=new Array();
    arr[0]="images/1.jpg";
    arr[1]="images/2.jpg";
    arr[2]="images/3.jpg";
    arr[3]="images/4.jpg";
    setInterval(changeImg,timeInterval);
    function changeImg()
    {
        var obj=document.getElementById("obj");
        if (curIndex==arr.length-1) 
        {
            curIndex=0;
        }
        else
        {
            curIndex+=1;
        }
        obj.src=arr[curIndex];
    }
    </script>
    <center>
    <img id=obj src =arr[curIndex]  border =0>
       </center>
    

    方法二:

     </div>
          <div style="float:left; 60%; height: 1500px;  ">      
                  <ul id="img"style="width : 100%; height : 500px;">
                      <li><img src="images/1.jpg"></li>
                      <li><img src="images/2.jpg"></li>
                      <li><img src="images/3.jpg"></li>
                      <li><img src="images/4.jpg"></li>
                  </ul> 
              
             </div>   
             <script type="text/javascript">
             (function () {
                var i = 0;
                var $ = function (ID) { return document.getElementById(ID); };
                var timer = null, speed = 1000;
                $("img").getElementsByTagName("li")[0].style.display = "block";
                (function () {
                    if (i >= $("img").getElementsByTagName("li").length) {
                        for (var j = 0; j < $("img").getElementsByTagName("li").length; j++) {
                            $("img").getElementsByTagName("li")[j].style.display = "none";
                        }
                        i = 1;
                        $("img").getElementsByTagName("li")[0].style.display = "block";
                    } else {
                        for (var j = 0; j < $("img").getElementsByTagName("li").length; j++) {
                            //console.log(j+""+i);
                            if (j === i) {
                                $("img").getElementsByTagName("li")[j].style.display = "block";
                            } else {
                                $("img").getElementsByTagName("li")[j].style.display = "none";
                            }
                        }
                        i++;
                    }
                    timer = setTimeout(arguments.callee, speed);
                })();
            })();
        </script>      
    

      

  • 相关阅读:
    oracle 使用正则表达式获取字符串中包含的数字
    oracle 将逗号分隔的字符串转成多行记录
    sqlplus下 查看oracle 执行计划
    使用connect by 虚拟生成100条记录
    Lomsat gelral
    Legacy
    慢慢变小的序列(好题)
    Walls(扫描线)
    线段树求面积并,面积交,周长
    最小圆覆盖(随机增量||模拟退火)
  • 原文地址:https://www.cnblogs.com/feifeishi/p/5332829.html
Copyright © 2020-2023  润新知