<div class="slider" id="circle">
<a href=""><img src="img/1p.jpg" alt="" /></a>
<ul class="circle">
<!--移动鼠标触发事件-->
<li class="current" onmouseover="lunbo(1)" id="ico1">1</li>
<li onmouseover="lunbo(2)" id="ico1">2</li>
<li onmouseover="lunbo(3)" id="ico1">3</li>
<li onmouseover="lunbo(4)" id="ico1">4</li>
<li onmouseover="lunbo(5)" id="ico1">5</li>
<li onmouseover="lunbo(6)" id="ico1">6</li>
</ul>
<div class="arrow">
<a href="javaScript:;" class="arrow-l" onclick="bo2()" id="bo1"><</a>
<a href="javaScript:;" class="arrow-r" onclick="bo1()" id="bo2">></a>
</div>
</div>
<script>
var a = 1;
var t = 0;
window.onload = function(){
t = setInterval("bo1()", 4000);
}
function lunbo(num){
a = num;
var btn = document.getElementById("circle").getElementsByTagName("img")[0];
for (var i=1;i<7;i++) {
var li = document.getElementById("circle").getElementsByTagName("li")[i-1];
li.style.backgroundColor = "#3E3E3E";
if(num == i){
btn.src = "img/"+i+"p.jpg";
li.style.backgroundColor = "#B61B1F";
}
}
}
function bo1(){
if(a>=6){
a = 0;
}
a++;
lunbo(a);
}
function bo2(){
if(a<=1){
a = 7;
}
a--;
lunbo(a);
}
</script>
PS:这段代码是在我的京东项目中摘录过来的，有不懂得可以直接问我。主要功能是图片自己轮播，也可根据左右按钮调控，也可根据下面的数字球控制。
