请问怎么做图片轮播的左右切换按钮
程序代码：<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
*{ margin:0px; padding:0px;}
.main{ width:600px; height:400px; margin:0px auto; border:1px solid #0F6;}
.main_img{ width:600px; height:300px; float:left;}
.main_banner{ width:149px; height:100px; float:left; margin-right:1px;}
.butto{ color:#F00; width:50px; height:100px;}
</style>
</head>
<body>
<div class="main">
<img src="images/pp.png" class="main_img" onmouseover="pp()" onmouseout="xx()">
<img src="images/qwe.png" class="main_banner" onClick="hh(this)">
<img src="images/trt.png" class="main_banner" onClick="hh(this)">
<img src="images/ww.png" class="main_banner" onClick="hh(this)">
<img src="images/ww.png" class="main_banner" onClick="hh(this)">
</div>
</body>
<script>
var x=document.getElementsByTagName('img');
var y=2,z=0;
var st=setInterval('changE()',1000);
function changE(){
y--;
if(y==0){
x[0].src=x[z].src;
z++;
y=2;
}
if(z>4)
z=0;
}
function xx(){
st=setInterval('changE()',1000);
}
function pp(){
clearTimeout(st);}
function hh(obj){
x[0].src=obj.src;
}
</script>
</html>
