Sujet Précédent Sujet Suivant

Fondu enchainé

alexrio098 - 6 août 2012 à 10:29
cs_L0ci Messages postés 224 Date d'inscription vendredi 26 novembre 2010 Statut Membre Dernière intervention 11 juin 2013 - 6 août 2012 à 13:53

Bonjour tout le monde,

J'aurai besoin de votre aide pour finaliser mon code.

J'aimerai réalisé un fondu enchainé entre le changement de mes images je sais pas si cela est possible avec mon code actuel j'ai essayé plusieurs méthode sans succès.

Voici mon bout de code qui fonctionne parfaitement :

<html>
<head>
<title>
</title>
</head>

<SCRIPT language=JavaScript1.1>

// Dossier où se situent les images
var dossier="images";

// Le tableau qui va contenir les images.
var tab_images=new Array();
tab_images[0]=[dossier+"/image2.JPG", "accueil.html"];
tab_images[1]=[dossier+"/image3.JPG", "accueil.html"];
tab_images[2]=[dossier+"/image1.JPG", "accueil.html"];

// Le délai de passage d'une image à l'autre en millisecondes -> 1s=1000
var delai=3000;

// Variable de compteur qui indiquera à quelle image on se trouve
var compteur=1;

// La fonction qui va permettre le défilement
function Diaporama(){
// partie où on applique les filtres propres à IE
document.images.diaporama.src=tab_images[compteur][0];
document.getElementById("linkTo").href = tab_images[compteur][1];
// On incrémente le compteur de 1 pour passer à l'image suivante
compteur++;
// Si on a atteint la dernière image, on remet à zéro le compteur et on rappelle la fonction Diaporama()
if (compteur==tab_images.length)
compteur=0;
setTimeout("Diaporama()",delai)
}
// On charge au démarrage de la page la fonction de défilement des images
window.onload=new Function("setTimeout('Diaporama()',delai)")
</SCRIPT>

[accueil.html

]

</html>

Merci d'avance.

A voir également:

Diaporama javascript fondu
Récupérer données json (javascript) - Conseils pratiques -Javascript
Javascript poo - Conseils pratiques -Javascript
Base de données javascript - Conseils pratiques -Javascript
Calendrier javascript - Conseils pratiques -Javascript
Alert javascript - Conseils pratiques -Javascript

2 réponses

Réponse 1 / 2

cs_L0ci Messages postés 224 Date d'inscription vendredi 26 novembre 2010 Statut Membre Dernière intervention 11 juin 2013 7
6 août 2012 à 11:19

Bonjour,

Pour faire simplement un fondu tu peux utiliser la fonction fadeIn() de jQuery. ici

Réponse 2 / 2

cs_L0ci Messages postés 224 Date d'inscription vendredi 26 novembre 2010 Statut Membre Dernière intervention 11 juin 2013 7
6 août 2012 à 13:53

Salut,

alors pour l'utiliser c'est assez simple. Il suffit de mettre ceci pour charger l'image:

$("#tag").fadeOut(1000, function(){$('#tag').load('url image');});
$("#tag").fadeIn(1000, function(){});

J'explique:
#tag est l'id du conteneur de l'image
fadeOut() le fait disparaître. Lorsqu'il a disparu tu executes la fonction .load() qui charge ton image dans le conteneur
fadeIn() fait réapparaitre ton conteneur

A toi d'adapter ça a ton code si c'est ce qu'il te faut.

PS:Quand tu ouvres un sujet, poses tes questions dedans c'est la pour ça. Les mp ça n'aide personne...

Discussions similaires

Partie entiére d'un nombre

integrer une variable javascript dans un lien hypertext

est-ce que "goto" existe en javascript ?

Partie entière d'un nombre

Redirection par header ou javascript?

Votre réponse

Discussions similaires