Bonjour à tous,
Je ne sais pas comment adapter ce script qui fonctionne très bien sous IE à firefox.
Quelqu'un pourrait-il m'aider ?
Merci beaucoupCode:<SCRIPT> ////////////////////////////////////////////////////////// // La fonction animatedObject() met en place les objets pour l'animation function animatedObject(elementName,loop,speed,steps,endRoutines,route){ this.elementName = elementName; this.loop = loop; this.speed = speed; this.steps = steps; this.frameIndex = 0; this.endRoutines = endRoutines; this.route = route.split(','); this.animate = animateObject; this.move = moveObject; this.show = showObject; this.hide = hideObject; animatedObjects[elementName] = this; } // La fonstion stopTimeline() arrête une ligne du temps. // Il suffit de lui passer le numéro de la ligne du temps. function stopTimeline(timelineNumber){ animationTime[timelineNumber] = animationTimeline[timelineNumber].length; } // La fonction startTimeline() lance une ligne du temps. // Il suffit de lui passer le numéro de la ligne du temps. function startTimeline(timelineNumber) { animationTime[timelineNumber] = 0; timelineController(timelineNumber); } // La fonction timelineController() contrôle la ligne du temps. // Elle boucle toutes les 100 millisecondes. function timelineController(timelineNumber) { if (animationTime[timelineNumber] <= animationTimeline[timelineNumber].length - 1) { animationTime[timelineNumber]++; if (animationTimeline[timelineNumber][animationTime[timelineNumber]] != null){ eval(animationTimeline[timelineNumber][animationTime[timelineNumber]]); } setTimeout('timelineController(' + timelineNumber + ')', 100); } } // La fonction showObject() rend un élément Html visible. function showObject(){ eval(layerObj + '["' + this.elementName + '"]' + styleObj + '.visibility = "visible"'); } // La fonction hideObject() rend un élément Html invisible. function hideObject(){ eval(layerObj + '["' + this.elementName + '"]' + styleObj + '.visibility = "hidden"'); } // La fonction moveObject() fait bouger un élément Html jusqu'à une position déterminée. // On lui passe les coordonnées x et y. function moveObject(left, top){ eval(layerObj + '["' + this.elementName + '"]' + styleObj + '.top = top'); eval(layerObj + '["' + this.elementName + '"]' + styleObj + '.left = left'); } // La fonction animatedObject() anime les objets function animateObject(){ if (this.route.length > 4 && this.frameIndex < this.route.length) { this.move(this.route[this.frameIndex], this.route[this.frameIndex + 1]); this.frameIndex += 2; setTimeout('animatedObjects["' + this.elementName + '"].animate()', this.speed); } else if (this.route.length == 4 && this.frameIndex <= this.steps) { this.move(parseInt(this.route[0]) + (this.frameIndex * ((parseInt(this.route[2]) - parseInt(this.route[0])) / this.steps)), parseInt(this.route[1]) + (this.frameIndex * ((parseInt(this.route[3]) - parseInt(this.route[1])) / this.steps))); this.frameIndex++; setTimeout('animatedObjects["' + this.elementName + '"].animate()', this.speed); } else { eval(this.endRoutines + ""); this.frameIndex = 0; if (this.loop == "yes"){ this.animate(); } } } ///////////////////////////////////////////////// ///////// Configurer le script ici/////////////// function initAnimation() { url="trans21bis.html" // Détecte le browser et masque le modèle object. layerObj = (isNS) ? 'document' : 'document.all'; styleObj = (isNS) ? '' : '.style'; // Crée les arrays pour les ligne du temps et les animations. animationTime = new Array(); animationTimeline = new Array(); animatedObjects = new Object(); // Voici le premier objet animé. Des explications s'imposent... /* robot1 = new animatedObject( 'objet1h', - Le nom de l'objet à animer (voir les DIV) 'no', - Est-ce que l'animation boucle ? 25, - Le délai entre chaque déplacement en millisecondes 25, - Le nombre de déplacement par animation 'null', - Le code à éxercuter à la fin de l'animation (sinon, null) '800,170,20,170'); - Les coordonnées de départ et d'arrivée 800 : position de départ par rapport au bord gauche 170 : position de départ par rapport au bord supérieur 20 : position d'arrivée par rapport au bord gauche 170 : position d'arrivée par rapport au bord supérieur */ objet1 = new animatedObject('objet1h', 'no', 25, 25, 'null', '800,140,50,140'); // Pigé ?... Voici les animations suivantes. objet2 = new animatedObject('objet2h', 'no', 25, 25, 'null', '800,200,50,200'); objet3 = new animatedObject('objet3h', 'no', 25, 25, 'null', '800,260,50,260'); objet4 = new animatedObject('objet4h', 'no', 50, 50, 'null', '800,320,50,320'); objet5 = new animatedObject('objet5h', 'no', 50, 50, 'null', '800,600,50,80'); objet6 = new animatedObject('objet6h', 'no', 25, 25, 'null', '800,600,20,100'); objet7 = new animatedObject('objet7h', 'no', 40, 40, 'null', '0,500,0,0'); objet8 = new animatedObject('objet8h', 'no', 25, 25, 'null', '300,0,300,60'); // Nous allons créer maintenant une ligne du temps Timeline[0] pour lancer les animations. animationTimeline[0] = new Array(); /* animationTimeline[0][10] = 'objet1.show();objet1.animate();'; La ligne du temps Timeline[0] va lancer, après 1 seconde [10], la fonction objet1.show() et la fonction objet1.animate(). Et on continue ... */ animationTimeline[0][10] = 'objet1.show();objet1.animate();'; animationTimeline[0][12] = 'objet2.show();objet2.animate();'; animationTimeline[0][14] = 'objet3.show();objet3.animate();'; animationTimeline[0][31] = 'objet4.show();objet4.animate();'; animationTimeline[0][40] = 'objet5.show();objet5.animate();'; animationTimeline[0][80] = 'objet6.show();setTimeout("window.location=url", 1500)'; animationTimeline[0][1] = 'objet7.show();objet7.animate();'; animationTimeline[0][68] = 'objet8.show();objet8.animate();'; // On démarre maintenant la ligne du temps. // Notons que le lancement de l'animation peut être associé autrement // qu'au chargement de la page mais par un onClick ou autre. startTimeline(0); } //////////////////////////////////////////////////////s var layerObj, styleObj, totalTime, currTime; var animationTime, animationTimeline, animatedObjects; var bon, boff; var isNS = (navigator.appName == "Netscape"); var isDHTML = (parseInt(navigator.appVersion) > 3); </SCRIPT> </head> <BODY BGCOLOR="#FFFFFF" onLoad = "initAnimation()" style="width:100%;overflow-x:hidden;overflow-y:hidden"> <DIV ID = "objet7h" STYLE = "position: absolute; left: 160; top: 50; visibility: hidden;"> <IMG SRC = "BGANIM1A.gif" NAME = "objet7g" HEIGHT = "440" WIDTH = "140"> </DIV> <DIV ID = "objet1h" STYLE = "position: absolute; left: 240; top: 100; visibility: hidden;"> <IMG SRC = "h.gif" NAME = "objet1g" HEIGHT = "40" WIDTH = "40"> </DIV> <DIV ID = "objet2h" STYLE = "position: absolute; left: 150; top: 100; visibility: hidden;"> <IMG SRC = "t.gif" NAME = "objet2g" HEIGHT = "40" WIDTH = "40"> </DIV> <DIV ID = "objet3h" STYLE = "position: absolute; left: 195; top: 120; visibility: hidden;"> <IMG SRC = "m.gif" NAME = "objet3g" HEIGHT = "40" WIDTH = "40"> </DIV> <DIV ID = "objet4h" STYLE = "position: absolute; left: 165; top: 240; visibility: hidden;"> <IMG SRC = "l.gif" NAME = "objet4g" HEIGHT = "40" WIDTH = "40"> </DIV> <DIV ID = "objet5h" STYLE = "position: absolute; left: 120; top: 240; visibility: hidden;"> <IMG SRC = "d.gif" NAME = "objet5g" HEIGHT = "40" WIDTH = "40"> </DIV> <DIV ID = "objet6h" STYLE = "position: absolute; left: 400; top: 280; visibility: hidden;"> <IMG SRC = "enter.gif" NAME = "objet6g" HEIGHT = "48" WIDTH = "138"> </DIV> <DIV ID = "objet8h" STYLE = "position: absolute; left: 400; top: 50; visibility: hidden;"> <IMG SRC = "pubhtml.gif" NAME = "objet8g" HEIGHT = "129" WIDTH = "346"> </DIV>
Ajout de la balise "Code".
yoda1234.
-----
