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

    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    <script type="text/javascript">
    var b = 1;
    function showImg(type){
    document.getElementById("imgDiv").innerHTML='<img src="img/'+b+'.jpg">';//修改div的内容
    if(type == 'shang'){//点击上一页b--
    b--;
    if(b == 0){//如果是第一张 修改为最后一张
    b = 6;
    }
    }else{//点击上一张 b自增
    b++;
    if(b==7){//如果是最后一张 修改为第一张
    b = 1;
    }
    }
    }
    /*<div id="imgDiv"> <img src="img/1.jpg"> </div>
    <button onClick="showImg('shang')">上一张</button>
    <button onClick="showImg('xia')">下一张</button>*/
    </script>
    </head>

    <body>
    <div id="imgDiv">
    <img src="img/1.jpg">
    </div>
    <button onClick="showImg('shang')">上一张</button>
    <button>1</button>
    <button>2</button>
    <button>3</button>
    <button>4</button>
    <button>5</button>
    <button onClick="showImg('xia')">下一张</button>
    </body>
    </html>

  • 相关阅读:
    微信强制更新版本机制
    js常用函数
    小程序--三级联动
    vue基础知识总结
    vuex基础知识总结
    vue-cli新手总结
    css---switch开关
    flutter 主题切换
    flutter 监听返回键
    flutter-常用按钮(爬取转载)
  • 原文地址:https://www.cnblogs.com/zhang12354/p/7682415.html
Copyright © 2011-2022 走看看