1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5 <title>简单的图片轮换</title>
6 <style type="text/css">
7 *{
8 margin:0;
9 padding:0;
10 }
11
12 #banner{
13 position:relative;
14 width:954px;
15 height:198px;
16 margin:5px auto;
17 border:2px solid #f00;
18 }
19 #banner div{
20 position:absolute;
21 }
22 </style>
23
24 <script type="text/javascript">
25 var minnum=1;//起始数
26 var maxnum=3;//结束数
27 var nownum=1;//当前数
28 function changepic(){
29 for(var i=minnum;i<=maxnum;i++){
30 if(nownum==i)
31 document.getElementById("mypic").src="images/banner_img"+i+".jpg";
32 }
33 nownum++;
34 if(nownum==(maxnum+1)){
35 nownum=1;
36 }
37 window.setTimeout(changepic,3000);
38 }
39
40 </script>
41 </head>
42
43 <body>
44 <ul>
45 <li id="banner">
46 <div>
47 <A href="#">
48 <img src="images/banner_img1.gif" id="mypic"/>
49 </A>
50 </div>
51 </li>
52 </ul>
53 </body>
54 </html>
这是一个简单的图片轮换代码.
给img设置了id,在javascript中通过document.getElementById("").src得到img的路径，进行修改。
956
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
