11548 sujets

JavaScript, DOM et API Web HTML5

Bonsoir,

j'ai plusieurs <div> dans une page : un premier, horizontal, contient une entête de présentation, un second, vertical, contient un menu et un troisième va contenir les données qui dépendent du choix fait dans le menu. La hauteur du troisième est fixe pour l'instant. J'aimerais que cette hauteur corresponde exactement à la hauteur du div menu, qui change constament par apparition ou disparition de sous-menu. Je récupère donc offsetHeight de ce div "menu" et l'applique au div "données'. Mais la hauteur de ce div "donnée" devient alors n'importe quoi.
Voici 2 lignes de code

	menu = document.getElementById("menu");
	h = menu.offsetHeight;
	dest.innerHTML="<object style='position: absolute;width : 60% ; height:"+h+"px' data="+page+"></object>";



Je pense ne pas avoir compris comment marche offetHeight.
Avez vous des idées ?
Merci
Je pense que tu devrais chercher une solution en CSS car si un de tes visiteurs à son Javascript désactivé il va avoir quoi ...
La methode en js semble bonne, je comprend pas pourquoi ça ne marche pas, par contre je ne voit pas trop l'intéret d'utiliser innerHtml, pourquoi ne pas tout simplement laisser ton objet en hauteur fixe et lui attribuer une hauteur avec js. Sinon en css tu doit pouvoir le faire avec un autre div en clear à la fin de ton div de maniére qu'il se place toujours à la fin du menu
Salut,

où dans le document et comment est déclaré ton script ?

Aussi, est ce que tu as vérifié les messages d'erreurs de la console javascript de firefox par exemple ? Qu'est ce que ça dit ?
Bonsoir et merci pour ces réponses. Je vais essayer d'apporter les quelques précisions demandées
a écrit :

où dans le document et comment est déclaré ton script ?

voilà l'appel du script, placé dans l'entête, jusgte après les balises <link> des css
<script src="MonScript.js" type="text/javascript">
</script>
a écrit :

est ce que tu as vérifié les messages d'erreurs de la console javascript


oui bien sur. Je n'ai aucune erreur ni sous FF ni sous IE6 ou 7. Mes pages sont validées ainsi que mes css

a écrit :

aire avec un autre div en clear à la fin de ton div de maniére qu'il se place toujours à la fin du menu

je vais essayer cette solution. On ne sait jamais

Bonne soirée
salut,

est ce que ceci
coucou a écrit :


menu = document.getElementById("menu");
h = menu.offsetHeight;
dest.innerHTML="<object style='position: absolute;width : 60% ; height:"+h+"px' data="+page+"></object>";



est le contenu complet du fichier MonScript.js ????
Modifié par clb56 (09 Jan 2007 - 18:35)
Non bien sûr ces lignes ne sont qu'une toute petite partie du script. Ce fichier fait environ 600 lignes pour l'instant et contient surtout de la manipulation de DOM
Voilà d'ailleurs la fonction complète de laquelle ces lignes sont extraites

function ajout(e)
{
       var page;
       if (!e) var e = window.event;

	if (e.target)
		targ = e.target;
	else
		if (e.srcElement) //IE
			targ = e.srcElement;

	if (targ.nodeType == 3) //Safari
		targ = targ.parentNode;
	k=0;
	while ((k < nomLi.length) && (nomLi[k] != targ.innerHTML))
			k++;

	if (nomLi[k] == targ.innerHTML){	
		page = pages[k];
	}
	else
		alert("pas de page");	
	dest = document.getElementById("page");
	menu = document.getElementById("menu2");
	
	var h=menu.style.offsetHeight;
	dest.innerHTML="<object style='position: absolute;width : 60% ; height:"+h+"px' data="+page+"></object>";

}
a beh voilà il est peut-être tout simplement là le probléme, dans le dernier message tu as menu.style.offsetHeight, au lieu menu.offsetHeight. Ceci dit c'était bien codé dans le premier message... Essaye de mettre un alert(menu.offsetHeight) pour voir si il trouve bien la bonne valeur.
ah oui tiens je n'avais pas fait attention.
Merci
J'ai d'ailleurs résolu le problème : cette "erreur" bien sur mais également une autre bêtise. Mon dest.innerHTML="<object style='position: absolute;width : 60% ; height:"+h+"px' data="+page+"></object>"; me permet de charger une page html à l'intérieur d'un div. Or il se trouve que je ne modifiais pas la taille du div conteneur mais seulement celle de l'objet inséré. Et depuis tout est nickel.
Merci encore
Modifié par coucou (10 Jan 2007 - 15:35)