<style type="text/css"> * { margin:0px auto; padding:0px; font-family:"微软雅黑";} #tuijian { width:760px; height:474px; background-repeat:no-repeat;} .pages { top:230px; background-color:#FFF; background-position:center; background-repeat:no-repeat; opacity:0.4; width:30px; height:60px } #p1 { background-image:url(zuo.png); float:left; margin:150px 0px 0px 10px;} #p2 { background-image:url(you.png); float:right; margin:150px 10px 0px 0px;} </style> </head> <body> <!--2.换图--> <div id="tuijian" style="background-image:url(t1.jpg);"> <div class="pages" id="p1" onclick="dodo(-1)"></div> <div class="pages" id="p2" onclick="dodo(1)"></div> </div> <!--1.10s后同意--> <form> <input id="wait" type="button" value="同意(10)" disabled="disabled" /> </form> </body> </html> <script language="javascript"> var jpg = new Array(); jpg[0]="url(t1.jpg)"; jpg[1]="url(t2.jpg)"; jpg[2]="url(t3.jpg)"; var tjmg = document.getElementById("tuijian"); var xb=0;var n=0; function huan() { xb++; if(xb==jpg.length) { xb=0; } tjmg.style.backgroundImage=jpg[xb]; if(n==0) { var id = window.setTimeout("huan()",3000); } } function dodo(m) { n=1; xb=xb+m; if(xb<0) { xb=jpg.length-1; } else if(xb>=jpg.length) { xb=0; } tjmg.style.backgroundImage=jpg[xb]; } window.setTimeout("huan()",3000); var n=10; var wait = document.getElementById("wait"); function bian() { n--; if(n==0) { wait.removeAttribute("disabled"); wait.value="同意"; return; } else { wait.value="同意("+n+")"; window.setTimeout("bian()",1000); } } window.setTimeout("bian()",1000); </script>