在Slider下方添加導航按鈕

Question

我有一個使用Jquery製作的非常簡單的Slider，我想在滑塊下添加導航。它可能是點框，任何事情都很好。

請幫我這個。下面是

 $(document).ready(function(){ 

      $('.sp').first().addClass('active'); 
      $('.sp').hide();  
      $('.active').show(); 

       $('#button-next').click(function(){ 

       $('.active').removeClass('active').addClass('oldActive');  
           if ($('.oldActive').is(':last-child')) { 
        $('.sp').first().addClass('active'); 
        } 
        else{ 
        $('.oldActive').next().addClass('active'); 
        } 
       $('.oldActive').removeClass('oldActive'); 
       $('.sp').fadeOut(); 
       $('.active').fadeIn(); 


       }); 

        $('#button-previous').click(function(){ 
       $('.active').removeClass('active').addClass('oldActive');  
         if ($('.oldActive').is(':first-child')) { 
        $('.sp').last().addClass('active'); 
        } 
         else{ 
       $('.oldActive').prev().addClass('active'); 
         } 
       $('.oldActive').removeClass('oldActive'); 
       $('.sp').fadeOut(); 
       $('.active').fadeIn(); 
       }); 
      }); 
    </script> 

    <div id="slider-wrapper"> 
    <div id="slider"> 
     <div class="sp" style="background: blue;">akjdfalfkdj</div> 
     <div class="sp" style="background: yellow;">akjdfautlfkdkjkhkj</div> 
    </div> 
    <div id="button-previous">prev</div> 
    <div id="button-next">next</div> 
    <div id=""nav"></div> 

http://jsfiddle.net/HsEne/15/

Answer 1

你想是這樣的jQuery代碼補充說

JSFIDDLE

代碼的代碼。

var n = $("#slider div").length; 
var i=1; 

while(n>i) 
{ 
    $(document.body).append($("<div>"+i+"</div>")); 
    i++; 
}