1 Dernière modification par estim (22-04-2016 21:33:31)

Sujet : Slideshow Simple

$("#next").click(imageSuivante);
$("#before").click(imagePrecedente);

function imagePrecedente(){
    
    $("#rail").animate(
        {"margin-left" : "+400px" }
         , 3000, changeDerniereimage);
}

function changeDerniereimage(){
    //Remettre le margin-left à 0
    $("#rail").css("margin-left","0px");
    //On déplace apres la derniere image la premiere
    $("#slideshow img:first").before( $("#slideshow img:last") );
}

function imageSuivante(){
    
    $("#rail").animate(
        {"margin-left" : "-400px" }
         , 3000, changePremiereImage);     
}

function changePremiereImage(){
    //Remettre le margin-left à 0
    $("#rail").css("margin-left","0px");
    //On déplace apres la derniere image la premiere
    $("#slideshow img:last").after( $("#slideshow img:first") );
}