Probleme d'acces au style

Bonjour tout le monde

Apres avoir essayé de m'en sortir en faisant des recherches sur differents forums, je n'ai pas trouvé la solution a mon probleme...

Voila,

je créé un <ul> en dur dans mon fichier html avec un " id='ul_principal' ".

Je créé un <li> à l'interrieur du premier, en dur dans le html, sans identifiant, avec un "width:auto" definit dans a feuille de style.

En javascript, via la DOM, j'aimerai acceder au width de ce precedent <li>, mais recuperer les valeurs en pixel...

Alors j'ai essayé cela (js) :

var mon_ul_principal = document.getElementById("ul_principal") ;
var mon_li_enfant = mon_li_principal.lastChild ;

//premier test :
var ma_largeur = mon_li_enfant.offsetWidth;
alert(ma_largeur); // affiche "0"
//2e
ma_largeur = mon_li_enfant.clientWidth;
alert(ma_largeur); // affiche "0"
//3e
ma_largeur = mon_li_enfant.style.width;
alert(ma_largeur); // affiche rien du tout

Pourtant le width du <li> a l'ecran est loin de faire 0...

J'aimerai que vous m'eclairiez s'il vous plait, je pense que je dois melanger des choses....

Merci
Modifié par Sk1tten (03 Oct 2006 - 11:44)

salut,

Avant de trouver la bonne syntaxe, il faut t'assurer que tu as bien récupéré l'objet DOM correspondant au <li> cherché; pour celà, fait un :

alert(mon_li_principal);

Ensuite, pourquoi récupères-tu le dernier <li> (lastChild...). Bon, je ne sais pas, c'est peut être normal, mais si c'est le 1er que tu veux récupérér, essaye plutôt:

var mon_li_enfant = mon_li_principal.firstChild ;

si c'est le premier <li> que tu veux tester.

A+

Merci de ta reponse

Oui, j'ai mis "lastChild" parcequ'il n'y avait qu'un seul enfant dans mon exemple, firstChild ou lastChild pointant sur le meme... l'un ou l'autre suffit... enfin bref

j'ai verifié que j'ai bien recuperé l'objet DOM et le nodeType me revoit "LI", donc c'est bon.

Maintenant, je ne sais pas acceder a ce width reel ....
Modifié par Sk1tten (03 Oct 2006 - 15:39)

var mon_ul_principal = document.getElementById("ul_principal") ;
var mon_li_enfant = mon_li_principal.lastChild ;

Je relis ton bout de code là, et je vois que :

mon_li_principal 

n'est déclaré nulle part. C'est pas :

mon_ul_principal

qui devrait se trouver là ?

Du coup, je me demande, là, comment tu fait pour récupérer quand même ton objet LI...?
Modifié par naudjf (03 Oct 2006 - 20:27)

Oups! Désolé, au temps pour moi

Dans mon vrai probleme, les variables ne portent pas ce nom là
Je la refais :

var mon_ul_principal = document.getElementById("ul_principal") ;
var mon_li_enfant = mon_ul_principal.lastChild ;

--------

D'autre part, je viens de trouver pourquoi le width me renvoie 0

En fait ces listes UL - LI sont les composantes d'un menu de navigation en CSS, avec un systeme pour cacher/afficher au passage de la souris. Et effectivement, quand les LI sont en "display:none" c'est un peu dur de trouver leur width... grr
(d'où le "0")

Auriez vous deja rencontré ce probleme ?
Modifié par Sk1tten (04 Oct 2006 - 09:33)

bonjour,

je vais surement dire une betise mais des fois que ? , ... et sans connaitre les valeurs css attribué aux menus.
La largeur de ton li , ne serait-elle pas par hasard la largeur de son ul conteneur ?
(cas des menu deroulant en demo sur alsacreations me semble t-il)

++

<edit> oui surement une betise .... autre piste :
peut-etre cache tu tes <li> al'aide de ton script , si javascript est activé , dans ce cas il te reste la solution de recuperer la largeur avant de passer le style en display:none;
</edit>
Modifié par gcyrillus (04 Oct 2006 - 11:44)