var curritem = 0;
var speed = 8000;

$(document).ready(function() {
    NbElement = $(".slider li").length;

    var slider = $("#slideshow .slider");
    var minSlider = $("#slideshow .min-slider");


    slider
    .wrap('<div class="slider-conteneur"></div>')
    .css("width", (579 * NbElement) );

    minSlider
    .wrap('<div class="min-slider-conteneur"></div>')
    .css("height", (101 * NbElement) );

    $("#slideshow .min-slider li img[id]").click(function(){
        curritem = $(this).attr("id")-2;
        next();
        clearInterval(timer);
        timer = setInterval(next,speed);
    });



    function next() {
        curritem++;

        if(curritem == NbElement ) {
            curritem = 0;
            slider.css("margin-left", "0px");
            minSlider.css("margin-top", "0px");
        }
        slider.animate({
            marginLeft : - (579 * (curritem))
        });
        minSlider.animate({
            marginTop : - (101 * (curritem))
        });
    }

    var timer = setInterval(next,speed);
});