script bug avec IE [contourné]

script bug avec IE [contourné] - HTML/CSS - Programmation

Marsh Posté le 21-05-2004 à 11:42:40    

Dans la continuité de mes autres questions ... Cette page teste le fonctionnement d'une arborescence. Je souhaite dérouler le contenu d'un dossier lorsque je clique sur l'icone. Je joue sur la propriété display de la balise <div> qui suit le noeud. Cela ne fonctionne pas avec IE: des que l'on clique sur la liste (meme hors de l'image de la liste) tout s'efface sauf la racine ... Le script fonctione correctement avec mozilla.
 
voici le code de la page en question
 

Code :
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. .noeudouvert
  5. {
  6. list-style-image:url("./img/folderopen.gif" );
  7. }
  8. .noeudferme
  9. {
  10. list-style-image:url("./img/folderclosed.gif" );
  11. }
  12. </style>
  13. <script language="Javascript">
  15. function openclosenode(node)
  16. {
  17. if ( document.getElementById(node).style.display == 'block' )
  18. {
  19.  document.getElementById(node).style.display = 'none';
  20.  //document.getElementById(node).class = 'noeudferme';
  21.  }
  22.  else
  23.  {
  24.   document.getElementById(node).style.display = 'block';
  25.  //document.getElementById(node).class = 'noeudouvert';
  26.  }
  27. }
  28. </script>
  30. </head>
  31. <body>
  32. <!-- arbre -->
  33. <ul class="treecontainer">
  34. <li id="elem00" onclick="openclosenode('00')" class="noeudouvert"><span class="display0">onclick</span></li>
  35. <div name="00" id="00" style="display:block" >
  36. <ul class="blocfils">
  37.  <li id="elem10" onclick="openclosenode('10')" class="noeudferme"><span class="display">onclick1</span></li>
  38.  <div name="10" id="10" style="display:none" >
  39.   <ul class="blocfils">
  40.    <li id="elem20" class="noeudferme"><span class="display">onclick4</span></li>
  41.    <li id="elem21" class="noeudferme"><span class="display">onclick5</span></li>
  42.    <li id="elem22" class="noeudferme"><span class="display">onclick6</span></li>
  43.   </ul>
  44.  </div>
  45.  <li id="elem11" class="noeudferme"><span class="display">onclick2</span></li>
  46.  <li id="elem12" class="noeudferme"><span class="display">onclick3</span></li>
  47. </ul>
  48. </div>
  49. </ul>
  50. </body>
  51. </html>


Message édité par boulax le 24-05-2004 à 09:17:52

---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 11:42:40   

Reply

Marsh Posté le 21-05-2004 à 12:23:31    

Un identifiant ne peut pas commencer par un chiffre. Il faudrait déja corriger ça.

Reply

Marsh Posté le 21-05-2004 à 12:30:34    

bobe a écrit :

Un identifiant ne peut pas commencer par un chiffre. Il faudrait déja corriger ça.


Ah ben tiens je l'ignorais.
 
Corrigé, sans effet. J'ai rajouté un return true aussi à la fin de la fonction JS au cas où... mais marche toujours pas avec IE.


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 12:36:19    

Un ID doit toujours être défini au commencement de la page avant de pouvoir être utilisé par javascript.


Message édité par Hermes le Messager le 21-05-2004 à 12:36:35
Reply

Marsh Posté le 21-05-2004 à 12:42:07    

:heink: ah bon ? et comment ? ....
 
D'autant plus que la fonction javascript est appelé bien apres la fin du chargement de la page, donc je vois doublement pas de quoi tu parles.


Message édité par boulax le 21-05-2004 à 12:59:50

---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 13:33:26    

boulax a écrit :

:heink: ah bon ? et comment ? ....
 
D'autant plus que la fonction javascript est appelé bien apres la fin du chargement de la page, donc je vois doublement pas de quoi tu parles.


 
Ou sont défini tes id dans les css ?

Reply

Marsh Posté le 21-05-2004 à 13:35:42    

Hermes le Messager a écrit :

Ou sont défini tes id dans les css ?


 
Nul part, les id n'ont rien a voir avec les css, du moins ici. Ils servent uniquement a identifier l'objet au sein du script.


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 13:37:13    

boulax a écrit :

Nul part, les id n'ont rien a voir avec les css, du moins ici. Ils servent uniquement a identifier l'objet au sein du script.


 
En tous cas, j'avais eu un problème similaire qui disparaissait en définissant mes ID au départ. Tu peux d'ailleurs les créer dynamiquement via javascript si tu veux.

Reply

Marsh Posté le 21-05-2004 à 13:38:55    

Tu pourrais me montrer comment tu fais pour définir des id au début de la page ?


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 13:40:46    

boulax a écrit :

Tu pourrais me montrer comment tu fais pour définir des id au début de la page ?


 
ben :
 
dans les css :
 
#tonid {
propriété : attributs;
etc...
}
 
 :??:

Reply

Marsh Posté le 21-05-2004 à 13:40:46   

Reply

Marsh Posté le 21-05-2004 à 13:49:07    

Je comprends pas à quoi ca sert ... C'est quoi la difference avec une classe CSS ? (cf le #..)


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 21-05-2004 à 14:00:21    

boulax a écrit :

Je comprends pas à quoi ca sert ... C'est quoi la difference avec une classe CSS ? (cf le #..)


 
Ben #id est unique. [:spamafote]

Reply

Marsh Posté le 21-05-2004 à 14:06:07    

Ouais bon bref ton truc c'est pas le bonne voie pour moi etant donné que je fait exactement le meme effet sur une autre page de la meme façon à la différence pres des listes. Donc pour essayer j'ai mis que des div avec des text-indent a la place des ul et li et miracle ca marche  :heink:


Message édité par boulax le 21-05-2004 à 14:06:30

---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 22-05-2004 à 11:29:38    

Pour en revenir à ton script qui a un soucis sous IE, je crois que

document.getElementById(node).style.display

ne fonctionne pas sous IE; utilise un test pour determiner le browser utilisé puis :

Code :
  1. // Si Moz/Netscape 6
  2. if (document.getElementById(node).style.display == 'block')
  3. {
  4.         document.getElementById(node).style.display = 'none';
  5.         //document.getElementById(node).class = 'noeudferme';  
  6. }
  7. else
  8. {
  9.         document.getElementById(node).style.display = 'block';
  10.         //document.getElementById(node).class = 'noeudouvert';  
  11. }
  13. ...
  15. // Si IE 6
  16. if (node.style.display == 'block')
  17. {
  18.         node.style.display = 'none';
  19.         //node.class = 'noeudferme';  
  20. }
  21. else
  22. {
  23.         node.style.display = 'block';
  24.         //node.class = 'noeudouvert';  
  25. }



---------------
Antisocial, tu perds ton sang froid Tu masques ton visage en lisant ton journal Repense a toutes ces années de service Antisocial, bientôt les années de sévices Enfin le temps perdu qu'on ne rattrape plus 4Ñ 7¡ $Ø Ç!ÂL
Reply

Marsh Posté le 22-05-2004 à 12:48:20    

Non non ca marche bien ce script (le getElementById) c'est juste que le browser gere mal l'apparition des listes va savoir pourquoi.
 
J'ai tout résolu avec des div et des span avec des style qui faut. Je posterai un screenshot le résultat est vraiment pas mal.


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 22-05-2004 à 13:20:30    

KrX a écrit :

Pour en revenir à ton script qui a un soucis sous IE, je crois que

document.getElementById(node).style.display

ne fonctionne pas sous IE; utilise un test pour determiner le browser utilisé puis :
[cpp]


 
Heureusement que si, ça fonctionne.

Reply

Marsh Posté le 22-05-2004 à 15:42:44    

Hermes le Messager a écrit :

Heureusement que si, ça fonctionne.


 
clair [:totoz]


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Marsh Posté le 24-05-2004 à 09:17:13    

Voila ce que ca donne sous ie
 
http://img18.imageshack.us/img18/6483/Image1.png


---------------
Posté depuis des chiottes, sales. Me gusta.
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed