• js简单图片切换

     1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8"/>
 5         
 6         <title>
 7 
 8         </title>
 9         
10     </head>
11         <style>
12             #zp img{
13                 margin:0 auto;
14             }
15         </style>
16     <body>
17         <div id="zp">
18         <img src="iamges/46.png" width="300" height="200" id="img1"/>
19         </div>
20         
21         <input type="button" value="上一张" onclick="sz()"/>
22         
23         <input type="button" value="下一张" onclick="xz()"/>
24     </body>
25     
26     <script type="text/javascript">
27             var picArr=new Array("iamges/46.png","iamges/47.png","iamges/48.png","iamges/49.png","iamges/50.png");
28             
29             var xp=0;
30             
31             function sz(){
32                 
33                 xp++;
34                 if(xp==picArr.length){
35                     xp=0;
36                 }
37                 document.getElementById("img1").src=picArr[xp];
38             }
39             
40             function xz(){
41                     xp--;
42                     if(xp<0){
43                         xp=picArr.length-1;
44                     }
45                     document.getElementById("img1").src=picArr[xp];
46             }
47         </script>
48 </html>
    View Code

    效果图

     
  • 相关阅读:
    生涯路
    事件与window的基本操作
    js操作
    c# 函数
    布局页面CSS
    网页填写的基本操作
    框架集
    网页的基本操作1
    存储与触发器
    常用的函数
  • 原文地址：https://www.cnblogs.com/LCH-M/p/7565391.html
Copyright © 2020-2023  润新知