zoukankan      html  css  js  c++  java
  • JS图片轮播

    <!DOCTYPE html>
    <html >

    <head>
        <meta charset="UTF-8">

        <title>Document</title>
        
    </head>

    <body>
        <img src="img/1.jpeg" id="flower">
        <br>
        <button id="prve">上</button>
        <button id="next">下</button>
        <script>
            // 获取id
              var flower=document.getElementById('flower');
              var nextbtn=document.getElementById('next');
              var prve=document.getElementById('prve');
              var minindex=1; maxindex=4;currentindex=minindex;
           
            //定义点击事件
          nextbtn.onclick=function(){
              currentindex++;
              if(currentindex==maxindex)
              {
                  currentindex=1;
              }
              flower.setAttribute('src','img/'+currentindex+'.jpeg')
          }

          prve.onclick=function(){
              currentindex--;
              if(currentindex==minindex)
              {
                  currentindex=4;
              }
              flower.setAttribute('src','img/'+currentindex+'.jpeg')
          }
        </script>
    </body>

    </html>
  • 相关阅读:
    JZOJ.2117. 【2016-12-30普及组模拟】台风
    团队合作
    长沙游记
    统计
    html....
    OI之路
    三鑫普及组模拟赛
    牛顿迭代法
    台风
    gcd
  • 原文地址:https://www.cnblogs.com/lxabner/p/12340702.html
Copyright © 2011-2022 走看看