<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> *{ margin:0px; padding:0px; font-family:"微软雅黑";} #tuijian{ width:940px; height:500px; background-repeat:no-repeat; margin:auto; } .pages{ line-height:500px; background-color:#000; background-position:center; background-repeat:no-repeat; opacity:0.4; width:30px; height:60px; } #p1 { background-image:url(zuo.jpg); float:left; margin:180px 0px 0px 10px;} #p2{ background-image:url(you.jpg); float:right; margin:180px 10px 0px 0px;} </style> </head> <body> <div id="tuijian" style="background-image:url(E8Z311O60R7W.jpg)"> <div class="pages" id="p1" onclick="dodo(-1)"></div> <div class="pages" id="p2" onclick="dodo(1)"></div> </div> </body> </html> <script type="text/javascript"> var jpg=new Array(); jpg[0]="url(1212.jpg)"; jpg[1]="url(1213.jpg)"; jpg[2]="url(1214.jpg)"; var tjimg=document.getElementById("tuijian"); var xb=0; var n=0; function huan() { xb++; if(xb==jpg.length) { xb=0; } tjimg.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; } tjimg.style.backgroundImage=jpg[xb]; } window.setTimeout("huan()",3000); </script>
