1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
|
$(document).ready(function() {
// Redéfinitions de styles et ajout de liens
$("#promo img").css("position","absolute");
$("#promo").css("position","relative");
$("#promo img:gt(0)").hide();
$("#promo").append("<p><a href=\"#\" class=\"prev\">Précédente</a> | <a href=\"#\" class=\"next\">Suivante</a></p>");
$("#promo p").css("padding-top","0");
// Gestionnaire de clic sur le lien suivant
$("#promo a.next").click(function() {
var $image_suivante = $("#promo img:visible").next("img");
if($image_suivante.length<1) $image_suivante = $("#promo img:first");
$("#promo img:visible").fadeOut();
$image_suivante.fadeIn();
return false;
});
// Gestionnaire de clic sur le lien précédent
$("#promo a.prev").click(function() {
var $image_precedente = $("#promo img:visible").prev("img");
if($image_precedente.length<1) $image_precedente = $("#promo img:last");
$("#promo img:visible").fadeOut();
$image_precedente.fadeIn();
return false;
});
// Défilement automatique
function auto() {
// On déclenche volontairement l'événement "click" sur le lien "a.next"
$("#promo a.next").trigger("click");
}
// La fonction setInterval nous permet de déclencher la fonction "auto" toutes les 5000 ms
setInterval(auto,5000);
}); |
Partager