自己写的简单的jquery焦点图

首页是自动播放代码：

 

var j=0;$.extend({  
showbig:function(){
$("#flashimg").show();//by dcdc723 http://dcdc723.iteye.com 指尖
var ob=document.getElementById("flashimg").getElementsByTagName("img");
for(i=0;i<ob.length;i++){ob.item(i).className="pics";}
ob.item(j).className="pics1";
j++;
if(j>=ob.length){j=0;}
}
}); 
setInterval("$.showbig()",3000); 

 

定义鼠标事件：

//by dcdc723 http://dcdc723.iteye.com 指尖
function om(i){
k=i-1; 
oib=document.getElementById("simg").getElementsByTagName("a");
for(i=0;i<oib.length;i++){oib.item(i).className="";}
oib.item(k).className="on";//by dcdc723 ttp://dcdc723.iteye.com 指尖
var ob=document.getElementById("flashimg").getElementsByTagName("img");
for(i=0;i<ob.length;i++){ob.item(i).className="pics";}
ob.item((k)).className="pics1";
}  

 

这里的className可自定样式表

 

html代码：

<style type="text/css">
.pics{display:none;}
.pics1{display:block;}
</style>

                  <div id="flashimg">
                           <a href="#"target="_blank"><img src="大图地址" /></a>
                   </div>
     <img src="/zt/zh/images/img_shadow.jpg" />
    </div>
    <div class="ad_simg" id="simg">
                   <a href="#"  οnmοuseοver="javascript:om(这里是图片顺序);"><img src="小图地址"/></a>
                 
    </div> 

 

om函数里的参数是当前是第几张图片;