轮播图jq版

轮播图的需求 1：图片自己轮播，并且下面的tabs小图标跟着显示 2.鼠标hover到tabs上面显示对应的图片 3、点击左右按钮，显示下一张图片。

<div >
    <div >
          <img src="/images/1.jpg" />
          <img src="/images/2.jpg" />
          <img src="/images/3.jpg" />
          <img src="/images/4.jpg" />
          <img src="/images/5.jpg" />
    </div>
    <ul >
        <li class="on"></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
      </ul>
       <div ><</div>
       <div id ="next" class="btn ">></div>
 </div>

　　

 1 var i=0,timer;
 2 $(function(){
 3      $("#imgs img").eq(0).show().siblings().hide();//第一张图片显示其余隐藏
 4  lunbo();
 5 //hover tabs
 6 $("#tabs li").hover(function(){
 7          clearInterval(timer);
           i=$(this).index();
 8      showPic();
 9 },function(){
10   lunbo();
11 });
12     
13 //点击切换下一张
14  $("next").click(function(){
15    clearInterval(timer);17   i++;
18    if(i==5){i=0};
19    showPic(); 
      lunbo()  20 });点击切换上一张 

45 }