Enchaniement d'images avec transitions choisies.

Soyez le premier à donner votre avis sur cette source.

Snippet vu 13 096 fois - Téléchargée 29 fois

Contenu du snippet

Ce code JavaScript permet de faire enchainer des images, chacune remplace autre apres un temps défini avec une transition blendTrans ou revealTrans qu'on on pointe la souris sur la première image et l'enchainement s'arrete qu'onl'enleve.
Merci à Redha pour son aide préciuese

Source / Exemple :


<HTML>
<HEAD><TITLE>Transition entre images</TITLE>
<SCRIPT language="JavaScript">

function etat(){
i=true
 startTrans()
 }
function startTrans(){
if(!i)return;
        SampleID.filters.blendTrans.Apply();
        SampleID.src = "cam3.jpg";
        SampleID.filters.blendTrans.Play()
	setTimeout("trans1()",7000);
}

function trans1(){
        if(!i)return;
        SampleID.filters.blendTrans.Apply();
        SampleID.src = "cam1.jpg";
        SampleID.filters.blendTrans.Play()
	setTimeout("trans2()",7000);
}

function trans2(){
if(!i)return;
        SampleID.filters.blendTrans.Apply();
        SampleID.src = "cam6.jpg";
        SampleID.filters.blendTrans.Play()
	setTimeout("trans3()",7000);
}

function trans3(){
if(!i)return;
        SampleID.filters.blendTrans.Apply();
        SampleID.src = "cam5.jpg";
        SampleID.filters.blendTrans.Play()
	setTimeout("startTrans()",7000);
}

function stopTrans(){
 i=false;      
SampleID.filters.blendTrans.Apply();
SampleID.src = "cam5.jpg";
SampleID.filters.blendTrans.stop()
}
</SCRIPT>
</HEAD>
<BODY>
<!-- Pour ceux qui preferent revealTrans la syntaxe est: style="filter:revealTrans(duration=4,transition=1)" à la place de blendTrans, il faut noter que si on change cela ici , le changement doit etre effectué tout au long de ce script, c'est à dire à la place de tout mot "blendTrans" dans le script doit etre remplecé par "revealTrans" ...//-->
<IMG id="SampleID" src="cam5.jpg" 
style="filter:blendTrans(duration=4)" onMouseover="etat()"
onMouseout="stopTrans()" 
width="109" height="72"><BR>
Click image for Transition Filter: Blend
</BODY>
</HTML>

Conclusion :


sidoummoudz@yahoo.fr

A voir également

Ajouter un commentaire Commentaires
Messages postés
24
Date d'inscription
dimanche 20 août 2006
Statut
Membre
Dernière intervention
7 janvier 2007

Modifie le titre: avec transitionS choisieS
car tu ne peut choisir q'une seule transition...
Messages postés
14
Date d'inscription
jeudi 21 août 2003
Statut
Membre
Dernière intervention
4 octobre 2006

Pas mal, mais un tableau contenant toutes les images serait plus simple a maintenir.
De + ta methode "stopTrans()" fait des trucs pas beau saut d'images lorsque l'on sort de l'image en cours de transformation. Je retirer les 3 dernière lignes. Comme ca la transition se finie normalementavant que le tout s'arrete.

PI : ce n'est pas compatible netscape 7.0

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.