Bonjour,
Je souhaite réaliser un petit effet vraiment tous simple, qui consiste à changer l'image d'une div au bout de 3 secondes, et ce en bouclant pour donner l'impression d'une vidéo qui défile.
Voici mon code :
Or la fonction setTimeout() est une fonction asynchrone, donc ce code ne fait pas le comportement escompté. En effet, il modifie correctement les images mais il fait la modification des 3 quasiment instantanément à quelques millièmes près (et les 750ms de la fonction).
Par ailleurs je pose la quéstion tout de suite, mais je ne sais pas comment rendre cette effet visuel car une boucle infinie en JavaScript fait monter en puissance votre machine !! Seule issue quitter le navigateur !!
Un magnifique exemple içi avec le défilement des sites dans le header.
Cordialement, DMO
PS : développement avec jQuery pour ceux qui n'auraient remarqué
Je souhaite réaliser un petit effet vraiment tous simple, qui consiste à changer l'image d'une div au bout de 3 secondes, et ce en bouclant pour donner l'impression d'une vidéo qui défile.
Voici mon code :
Bloc de code:
function changePics(picture){
$("#photos_ex").fadeOut("slow");
setTimeout('$("#photos_ex").css({ backgroundImage : "url(<?php echo bloginfo("template_url"); ?>/images/'+picture+')"});', 750);
$("#photos_ex").fadeIn("slow");
}
setTimeout('changePics("picture2.jpg")', 3000);
setTimeout('changePics("picture3.jpg")', 3000);
setTimeout('changePics("picture1.jpg")', 3000);
Par ailleurs je pose la quéstion tout de suite, mais je ne sais pas comment rendre cette effet visuel car une boucle infinie en JavaScript fait monter en puissance votre machine !! Seule issue quitter le navigateur !!
Un magnifique exemple içi avec le défilement des sites dans le header.
Cordialement, DMO
PS : développement avec jQuery pour ceux qui n'auraient remarqué