zoukankan      html  css  js  c++  java
  • 最简单的图片轮播

    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>无标题文档</title>  
    <script type="text/javascript">
        var arr = new Array;
        arr[0] = "../images/slide-01.jpg";
        arr[1] = "../images/slide-02.jpg";
        arr[2] = "../images/slide-03.jpg";
        var Timer = setInterval(play, 1000);
        var count = 1;
        function play() {
            if (arr.length == count)
                count = 0;
            document.getElementById("pic").src = arr[count];
            count++;
        }
        function clearTimer() {
            clearInterval(Timer);
        }

        function onMouseOver(obj) {
            clearTimer();
            var index = parseInt(obj.value);
            document.getElementById("pic").src = arr[index - 1];
            count = index;
        }
        function btnMouseOut() {
            Timer = setInterval(play, 1000);
        }
        function init() {
            var btns = document.getElementsByTagName("input");
            for (var i = 0; i < btns.length; i++) {
                btns[i].onmouseout = btnMouseOut;
            }
        }  
    </script>  
    </head>  
    <body onload="init()">  
    <img id="pic" src="../images/slide-01.jpg" width="600" height="315" alt=""/><br />  
    <input type="button" value="1" id="1" onmouseover="onMouseOver(this)"/>  
    <input type="button" value="2" id="2" onmouseover="onMouseOver(this)" />  
    <input type="button" value="3" id="3" onmouseover="onMouseOver(this)" />  

    </body>  
    </html> 

    转载原文:http://blog.csdn.net/wjr_loves/article/details/7865537

  • 相关阅读:
    Docker最全教程之MySQL容器化 (二十四)
    Docker最全教程之使用Node.js搭建团队技术文档站(二十三)
    Docker最全教程之使用PHP搭建个人博客站点(二十二)
    构建自己的简单微服务架构(开源)
    使用Jmeter进行http接口测试
    Appium 服务关键字
    Appium入门示例(Java)
    Appium for win7 环境搭建
    android adb常用指令
    Android测试环境搭建(win7)
  • 原文地址:https://www.cnblogs.com/lizihong/p/4015444.html
Copyright © 2011-2022 走看看