• 制作一个简单的轮播图


    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>

    <body>
      <img src="img/1.jpg" id="imge" onMouseMove="jieshu()" onMouseOut="kaishi()">
      <input type="button" value="上一页" onClick="up()">
      <input type="button" value="1" onClick="change(this)">
      <input type="button" value="2" onClick="change(this)">
      <input type="button" value="3" onClick="change(this)">
      <input type="button" value="4" onClick="change(this)">
      <input type="button" value="5" onClick="change(this)">
      <input type="button" value="6" onClick="change(this)">
      <input type="button" value="7" onClick="change(this)">
      <input type="button" value="8" onClick="change(this)">
      <input type="button" value="下一页" onClick="next()">
    </body>
    <script type="text/javascript">
      var imgs=["img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg","img/5.jpg","img/6.jpg","img/7.jpg","img/8.jpg"];
      var img=document.getElementById("imge");
      var index=0;
      var lunbo=null;
      kaishi();
      function change(obj){
        index=obj.value-1;
        img.src=imgs[index];
      };
      function next(){
        if(index==imgs.length-1){
          index=0;
        }else{
          index++;
        }
        img.src=imgs[index];
      }
      function up(){
        if(index==0){
          index=imgs.length
        }else{
          index--;
        }
        img.src=imgs[index];
      }
      function kaishi(){
        lunbo=setInterval(next,2000);
      }
      function jieshu(){
        clearInterval(lunbo);
      }
    </script>
    </html>

  • 相关阅读:
    retain assign copy (unsigned long)
    myeclipse未设置断点,但不断跳出debug
    SOAP tomcat7.0 HelloWorld
    JAVA第二天数据类型和循环
    java中产生随机数的几种方法
    java的第一个程序 Hello World
    java中产生随机数的几种方法
    用加减来简单的看策略类
    用加减来简单的看策略类
    奇数阶幻方
  • 原文地址:https://www.cnblogs.com/wode007/p/13055660.html
Copyright © 2020-2023  润新知