Bonjour
j'ai amélioré un bout de code pour afficher et cacher du texte avec effet de slide (affichage progressif)
sans le slide ca fonctionne
avec le slide ca fonctionne aussi... mais une seule fois sur chacun des items...
ensuitele display reste a none (firebug) et la largeur reste a 0 ...

mon code
//////////*****/////////
Code Javascript :
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
 
function SuiteH(thingId){	
	//  On ajoute la div a afficher et sa hauteur
	/// on recupere le nombre d'id
	 z=0;
	 for(i=1; i<=10;i++){
	 if (document.getElementById("divid" + i) ) z++;
	 } 
 //alert ('toto '+z);		 
	//on recupere id de la div a cacher
	IDaC=0;
	NbId =1;
	for (i = 1; i <= z; i++) {
		var objet = document.getElementById("divid" + i) ;
		//alert ('tutu '+document.getElementById("divid" + i).style.display);
		if (objet.style.display == "block") {
	       IDaC=NbId;
		    }
		NbId++;	
	}
	//alert ('toto '+IDaC);
   //on definit la largeur a reduire	
	largeur = 600;
///on cache la div
	//var i;
	var targetElement;
	//for(i=1; i<=NbId;i++){
	/* targetElement = document.getElementById("divid" + i) ;
	 targetElement.style.display = "none" ;*/
	if (IDaC != "0") {
alert ('tata '+IDaC);
	var targetElement = document.getElementById("divid" + IDaC);
	var lFinalH = 0; //largeur finale 
	var lActuelH = largeur; //largeur initiale 
	var timer;
	var fctH = function(){
		lActuelH -= 10; //Augmente la largeur de -10px  
		targetElement.style.width = lActuelH + 'px';
		if (lActuelH <= lFinalH) {
			clearInterval(timer); //Arrête le timer
			//targetElement.style.overflow = 'hidden';
			targetElement.style.display = "none";
			targetElement.style.width = "0"; // Fix du cache de la div +++
		}
	};
	fctH();
	timer = setInterval(fctH, 1); //Toutes les 1 ms
	//IDaC.innerHTML = "+";
	document.getElementById("divid" + IDaC).value = "+";
}
// }
 //on montre la div
 var objet;
 var lFinal;
 var lActuel;
 largeur2=600;
	var objet = document.getElementById("divid" + thingId) ; // entre les deux  le nom du div que tu veux faire apparaître 
	if (objet.style.display == "none" /*|| !objet.style.display*/) {
alert ('titi '+thingId);
 
		//objet.style.width  = "400px";
		//objet.style.overflow = "hidden";
		//thingId.innerHTML = "-";
		document.getElementById("divid" + thingId).value = "-";
		var lFinal = largeur2; //largeur finale (la largeur une fois que ça aura fini de déplier) 
		var lActuel = 0; //largeur initiale (la largeur au début)
		var timer;
 
		var fct = function(){
			lActuel += 10; //Augmente la largeur de 10px  
			objet.style.width = lActuel + 'px';
			if (lActuel > lFinal) {
				clearInterval(timer); //Arrête le timer
			/*objet.style.overflow = 'inherit';*/
			}
		};
		fct();
		timer = setInterval(fct, 1); //Toutes les 1 ms
		objet.style.display = "block";
	}	
}
//////////*****/////////

appel de la fonction
Code HTML :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
 
<a href="#" onclick="SuiteH('1')">et encore...</a><br />
<a href="#" onclick="SuiteH('2')">et plus...</a><br /><br />
 
<div id="bloc6">
<div id="divid1" style="position: absolute;display: none;  width: 0px;background-color : #734994; color : #ffffff;filter:alpha(opacity=90);opacity:0.9;">
texte
</div>
<div id="divid2" style="position: absolute;display: none;  width: 0px;background-color : #734994; color : #ffffff;filter:alpha(opacity=90);opacity:0.9;">
texte
</div>
</div>