js---图片轮播图

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script>
        /*
         * 1 确定事件:文档加载完成的事件onload
         * 2 事件要触发:init()
         * 3 函数里面要做一些事情:(通常会去操作元素,提供交互)
         *         1 开启定时器:执行切换图片的函数changeImg()
         * 
         * 4 changeImg()
         *         获得切换图片的那个元素
         */
        var index = 0;
        function changeImg(){
            var img=document.getElementById("img1");
            var currentindex = index%3+1;
            img.src="img/image/"+currentindex+".jpg";
            index=index+1;
        }
        
        function init(){
            setInterval("changeImg()",1000);
        }
        </script>
    </head>
    <body onload="init()">
        <img src="img/image/1.jpg" width="100%" style="padding: 1%;" id="img1" />
    </body>
</html>

 

posted @ 2019-07-17 14:54  薄眠抛却陈年事。  阅读(126)  评论(0编辑  收藏  举报