Slide show con pager numerico utilizzando jQuery e il plug-in Cycle

      #slideshow {
         width: 400px;
         height: 440px;
         overflow: hidden;
         margin-top: 0px;
         margin-right: auto;
         margin-bottom: 0px;
         margin-left: auto;
         padding: 0px;
      }
      
      .slide {
         width: 400px;
         height: 440px;
         text-align: center;
      }
      
      
      #navslideshow {
         width: 400px;
         margin-right: auto;
         margin-left: auto;
         height: 20px;
         text-align: center;
      }
      
      #navslideshow a:link {
         display:inline-block;
         width: 20px;
         height: 20px;
         margin-right: 5px;
         text-decoration: none;
         background-image: url(Immagini/bullet_off.png);
         background-repeat: no-repeat;
         line-height: 20px;
         text-align: center;
         color: #000;
         font-size: 10px;
      }
      
      #navslideshow a:hover {
         background:url(Immagini/bullet_hover.png) no-repeat;
         text-decoration: none;
         color: #000;
      }
      
      #navslideshow a:last-child {
         margin-right: 0px;
         text-decoration: none;
         color: #000;
      }
      
      #navslideshow a.activeSlide {
         background:url(Immagini/bullet_on.png) no-repeat;
         text-decoration: none;
         color: #000;
      }
      

      $(document).ready(function() {
         $('#slideshow').cycle({
            fx:		'fade',	// Dissolvenza
            speed:    1000,	// Velocità dell'animazione
            timeout:  2000,	// Tempo di permanenza di una slide
            pause:       1,	// Se 1 mette in pausa quando il mouse è sopra lo slide show, altrimenti 0
            startingSlide: 0,	// Parte dalla prima slide
            pager:	'#navslideshow'	// Crea la lista dei link per passare da una slide all'altra
         });
      });
      

<div id="slideshow">

	<div class="slide">
		<img src="Foto/slide_01.jpg" />
		<p>Caption of the first slide</p>
	</div>
	<div class="slide">
		<img src="Foto/slide_02.jpg" />
		<p>Caption of the second slide</p>
	</div>
	<div class="slide">
		<img src="Foto/slide_03.jpg" />
	</div>
	<div class="slide">
		<img src="Foto/slide_04.jpg" />
	</div>
	<div class="slide">
		<img src="Foto/slide_05.jpg" />
		<p>Caption of the fifth slide</p>
	</div>
</div>

<div id="navslideshow"></div>