Fondu enchainé

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Fondu enchainé

Re: Fondu enchainé

par sacapuss2 » 18 avr. 2013, 10:32

Bonjour !

j'ai écrit un fondu au transparent. Il fonctionne parfaitement bien :

[javascript]
Array.prototype.fondu2transparent=function(opas,sens,periode,laps,images)
{
var fondables=this;
var images=images||[];

var opas=opas||.005;
var periode=periode||2;
var sens=sens||1;
var laps=laps||2;

for(var i=0; i<periode; i++)
{
images=images||fondables.tirer();
images.style.opacity=images.style.opacity*1+(i?-1:1)*sens*opas;

if(images.style.opacity>periode)
{
while((images[(i+1)%periode].src=fondables.tirer().src)==images.src);
sens*=-1;
}
}

setTimeout(function(){fondables.fondu2transparent(opas,sens,periode,laps,images)},laps);
}
[/javascript]

Ce script dérive d'une fonction 'fondu-enchainé' qui est très peu différent, mais que je ne retrouve plus.

Auriez-vous une idée de la manière de modifier légèrement 'fondu2transparent', pour que l'image de dessous s'allume, en même temps que l'image de dessus s'éteint, et non pas après, comme avec 'fondu2transparent' ?

Merci de votre contribution !

Fondu enchainé

par alexrio098 » 06 août 2012, 10:49

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>

<body>
<a id="linkTo" href="accueil.html">
<IMG src="image1.JPG" name=diaporama border="0"/>
</a>
</body>
</html>

Merci d'avance.