Bonjour à tous,

je sais pas si mon titre est super explicite mais c'est ce que j'ai trouvé de mieux. Mon soucis c'est que j'ai un code avec deux fonction temporelle l'idée c'est d'avoir quatre balise qui deviennent transparente les unes-après les autres et qu'une fois la dernière transparente le cycle recommence. Sauf qu'au premier passage la première balise ne devient pas complètement transparente alors que les autres si (du certainement à un décalage de chargement quand je le teste sur le site). Puis au deuxième passage la rapidité de la transparence s’accélère jusqu'à devenir quasiment instantanée:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
</style>
</head>
<body>
  <div id="bobo0" style="width:100px; height:100px; background-color:black"></div>
    <div id="bobo1" style="width:100px; height:100px; background-color:yellow"></div>
    <div id="bobo2" style="width:100px; height:100px; background-color:green"></div>
    <div id="bobo3" style="width:100px; height:100px; background-color:orange"></div>
 
	<script type="text/javascript">
		// Fonction qui gère l'opacity sur tous les navigateurs
		// l'opacity doit être comprise entre 0 et 1
		function gen_opacity(obj,opacity){
 
		  //Internet explorer
		  obj.style.filter = 'alpha(opacity = ' + opacity*100 + ')' ;
 
		  //Ayant CSS3 intégré
		  obj.style.opacity = opacity;
 
		  //Mozilla/Phoenix/Firebird/Firefox
		  obj.style.MozOpacity = (opacity);
 
		  //moteur Khtml Linux safair et macOS
		  obj.style.KhtmlOpacity = (opacity);
 
		 }
 
		// variable globales		
		var x=-1,w,div_conteneur=[];
 
		// Récupération des balise div avec id bobo[x] dans le tableau div_conteneur
		div_list = document.getElementsByTagName('div');
		if(div_list)
		{
			for(w=0;w<div_list.length;w++)
			{
				if(div_list[w].id.indexOf('bobo'+w)!=-1)
				{
					div_conteneur.push(div_list[w]);
				}
			}
		}
function init(){
		//Creation de la première fonction setinterval
		var intervalID1 = setInterval(function() {
			// permet a chaque lancement de remettre y = 1 ou y est l opacité dans la deuxième fonction
			y=1;
 
			//Deuxième fonction setinterval qui transforme l opacité à 0 progressivement
            var intervalID2 = setInterval(function() {
						y-= 0.005;
							if(y>0)
							{
								// on appelle la fonction gen_opacity
								gen_opacity(div_conteneur[x],y);
							}
 
							// si y <= à 0 alors on arrête la boucle
							else
							{
								clearInterval(intervalD); 
							}
                        }, 10);
 
						// Permet d'atteindre toutes les balises contenue dans div_conteneur[x] 
						x+=1;
 
						// Si x est plus grand que la taille de l'array alors la boucle doit recommencer à x=-1 
						if(x>div_conteneur.length)
						{
							var i;
 
							// permet de remettre opacity à 1 dans toutes les div
							for(i=0;i<div_conteneur.length;i++)
							{
								gen_opacity(div_conteneur[i],1);
								x=-1;
							}
						}										
  }, 2100);}
  window.onload=init;
  	</script>
  </body>
</html>
j'ai inclut le code html avec pour que vous pussiez vous rendre compte.

D'avance merci à ceux qui prendront le temps de répondre.