[HTML] pobierz, plaintext 
 
<div id="slider">
    <a href=""><img src="slide_1.jpg" width="480" height="300" alt="Obrazek numer 1" /></a>
    <a href=""><img src="slide_2.jpg" width="480" height="300" alt="Obrazek numer 2" title="To jest tekstowy opis obrazka 2"  /></a>
    <a href=""><img src="slide_3.jpg" width="480" height="300" alt="Obrazek numer 3" title="#opisSlide2"  /></a>
    <a href=""><img src="slide_4.jpg" width="480" height="300" alt="Obrazek numer 4" title="#opisSlide3"  /></a>
</div>
 
<div id="opisSlide2" class="nivo-html-caption">
    To jest przykładowy <strong>html opis dla obrazka 3</strong>
</div>
<div id="opisSlide3" class="nivo-html-caption">
    To jest inny <strong>opis dla obrazka 4</strong>
</div>
 
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
 
$(window).load(function() {
    $('#slider').nivoSlider({
        effect:'random', //styl animacji
        slices:15, //ile kawałków przypada na animację
        animSpeed:500, //szybkość animacji
        pauseTime:3000, //szybkość zatrzymania na slajdzie
        startSlide:0, //zaczynamy od slajda
        directionNav:true, //czy pokazać strzałki next - prev
        directionNavHide:true, //pokaż strzałki tylko po najechaniu
        controlNav:true, //pokaż klikalne 1,2,3...
        controlNavThumbs:false, //użyj miniaturek dla powyższych
        controlNavThumbsFromRel:false, //użyj relatywnych ścieżek z miniaturek
        controlNavThumbsSearch: '.jpg', //Replace this with...
        controlNavThumbsReplace: '_thumb.jpg', //nazwa miniaturki
        keyboardNav:true, //użyj klawiatury (lewo / prawo)
        pauseOnHover:true, //zatrzymaj po najechaniu myszką
        manualAdvance:false, //własne przejście
        captionOpacity:0.8, //przezroczystość opisów
        beforeChange: function(){}, //zdarzenie wywoływane tuż przed animacją
        afterChange: function(){}, //zdarzenie wywoływane tuż po animacji
        slideshowEnd: function(){}, //wywoływane po animacji wszystkich slajdów
        lastSlide: function(){}, //po pokazaniu ostatniego slajdu
        afterLoad: function(){} //wywołane po załadowaniu slajdów (grafik)
    });
});
 
[HTML] pobierz, plaintext