Discussion :

[acheda]

Bonjour,

Malgré le grand nombre de sujets concernant les DIV, leur taille, et IE, je n'ai pas trouvé mon bonheur...

J'ai un DIV qui vient s'afficher par dessus ma page. (Comme une sorte de pop-up)
Je souhaite que le clic sur un bouton permette de réduire la hauteur de cette "pop-up" de manière à n'en voir que le haut (avec son titre) D'où les 17px. Le clic sur le même bouton (situé en haut), rendrait à la pop-up sa taille initiale.
(Celà permet de montrer ou non le contenu de la page en dessous du DIV).

J'ai du code qui fonctionne bien sous Firefox mais pas du tout sous IE.

Voici le code de la fonction appelée au clic sur le bouton (que ce soit pour fermer ou ouvrir la "pop-up") :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
reduc = function() {
	var ibox = getElem('ibox_wrapper');
	if(ibox.style.height != "17px"){
		document.getElementById("tailleIbox").value=ibox.style.height;
		ibox.style.height = 17;
	}
	else{
		ibox.style.height = document.getElementById("tailleIbox").value;
 
	}

"ibox" est donc mon DIV.
tailleIbox est une zone cachée où je stocke la hauteur initiale.

J'ai essayé d'utiliser OffsetHeight (peut-être mal) sans plus de succès, même moins car je n'arrivais plus à le faire marcher sous Firefox. Le soucis étant d'affecter une valeur à la hauteur du DIV, et non pas d'en récupérer une.

Voili... Si quelqu'un a un début de solution... Je l'en remercie d'avance

[jibouze]

Bonjour,
essaies de rajouter un display:block au moment de l'affectation de la hauteur.
J'ai eu le même pb.

[acheda]

Merci pour ta réponse!

J'ai donc maintenant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
reduc = function() {
	var ibox = getElem('ibox_wrapper');
	if(ibox.style.height != (17+"px")){
		document.getElementById("tailleIbox").value=ibox.style.height;
		ibox.style.height = 17 +"px";
		ibox.display = 'block';
	}
	else{
		ibox.style.height = document.getElementById("tailleIbox").value;
		ibox.display = 'block';
	}
}

Mais ça ne change rien (ça continue de fonctionner sous Firefox (ouf) mais rien de mieux sous IE...
Ai-je placé ma "commande" sur le bon objet?

[jibouze]

Oui, mais c'est pas "exactement" la bonne commande :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
ibox.style.display = 'block';

[acheda]

Oups
Mais bon, ça ne change pas le comportement sous IE...

J'ai l'impression que ça ressemble à une question de rafraîchissement car si je fait des alerts avec les différentes valeurs, sous IE, il m'affiche les bonnes valeurs de hauteur, comme s'il avait tout bien fait, mais à l'écran la taille de mon DIV n'a pas bougé d'un poil...

[jibouze]

Je suppose que tu fixes la taille initialement via un style et pas en js.
En tous cas, la taille initiale de ton DIV doit être ecrit "17px", par exemple.
Ensuite, ta fonction doit tester directement sur "17px" :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
reduc = function() {
	var ibox = getElem('ibox_wrapper');
	if(ibox.style.height != "17px")){
		document.getElementById("tailleIbox").value=ibox.style.height;
		ibox.style.height = "17px";
		ibox.display = 'block';
	}
	else{
		ibox.style.height = document.getElementById("tailleIbox").value+"px";
		ibox.display = 'block';
	}
}

chez moi ça marche sur IE (7.0)