Afficher/cacher une div : ne fonctionne pas sur IE 8

Afficher/cacher une div : ne fonctionne pas sur IE 8 - HTML/CSS - Programmation

Marsh Posté le 04-01-2009 à 14:59:22    

Bonjour,
J'ai fait une petite fonction en javascript pour affiche ou cacher une DIV.
En fait j'ai un bbcode avec les boutons d'insertion, et pour ne pas encombrer la page, j'ai ajouté un bouton "+" qui lors du clic affiche les boutons de bbcode supplémentaires.
 
Voici mon code :
 

Code :
  1. function manageDiv(name) {
  2.     visible = document.getElementById(name).style.display;
  3.     
  4.     if(visible == 'none') {
  5.         document.getElementById(name).style.display = 'block';
  6.         return false;
  7.     } else {
  8.         document.getElementById(name).style.display = 'none';
  9.         return true;
  10.     }
  11. }
  12.     
  13. window.onload = function() {
  14.     manageDiv('more');
  15. }


 
Et le bouton :
 

Code :
  1. <input type="button" id="plus" name="plus" value="+" onclick="
  2.     this.value = (manageDiv('more')) ? '+' : '-';" />
  3.  
  4. //onclick colorisé :
  5. this.value = (manageDiv('more')) ? '+' : '-';


 
La suite :
 

Code :
  1. <div id="more">
  2. <!-- boutons bbcode -->
  3. </div>


 
Mon problème : sous FF, ou google chrome, çà marche nickel... ...chrome  :o  
Mais sous IE 8, sous les autres je sais pas, mais sous IE 8 çà ne marche pas !
Lors du clic, la valeur du bouton reste "+" et les boutons contenus dans la DIV "more" sont vides ! aucune valeur !
Je ne comprends pas, je pense que çà vient de la gestion de display de IE 8 mais je ne suis pas sur.
 
Merci de votre aide !

Reply

Marsh Posté le 04-01-2009 à 14:59:22   

Reply

Marsh Posté le 04-01-2009 à 19:50:08    

up /
   .

Reply

Marsh Posté le 04-01-2009 à 22:39:57    

Voir déjà l'erreur Javascript remontée. A noter qu'IE 8 est encore une beta, et que l'important est que ça marche sur les anciennes versions.


---------------
http://www.aideinfo.com/  Whois adresses IP/domaines le plus évolué !!  FAQ Free Mobile
Reply

Marsh Posté le 04-01-2009 à 23:36:28    

IE c'est à chier :o

Message cité 1 fois
Reply

Marsh Posté le 05-01-2009 à 14:36:28    

FR-DarkRod a écrit :

IE c'est à chier :o


Oui, merci.
Sinon, tu as quelque chose d'un peu plus intéressant à dire ?

Message cité 1 fois
Reply

Marsh Posté le 05-01-2009 à 16:37:42    

Tu as sûrement déjà testé mais juste pour voir, tu as essayé un simple  

Code :
  1. alert(visible);


après l'assignation de visible pour voir ce qu'il contient ?

Message cité 1 fois
Reply

Marsh Posté le 05-01-2009 à 18:19:59    

Mr Mala a écrit :

Tu as sûrement déjà testé mais juste pour voir, tu as essayé un simple  

Code :
  1. alert(visible);


après l'assignation de visible pour voir ce qu'il contient ?


 
bah au premier clic : none, puis block, puis none, etc.

Reply

Marsh Posté le 05-01-2009 à 18:54:25    

Ok donc la propriété est bien mise à jour ...
Bon, je lance des trucs comme ça pour cerner le truc :
Cela semblerait logique que ton this dans ton onclick soit bien la référence au bouton lui-même .. mais une fois de plus, juste pour tester, rajoute un peu un "alert(this.value);" dans ce onclick ... ( puisque tu dis que le bouton reste à '+' )
Et selon toute logique, tu devrais avoir la première fois '+' ... sinon ......


Message édité par Mr Mala le 05-01-2009 à 18:55:34
Reply

Marsh Posté le 05-01-2009 à 18:59:18    

bah j'affiche this.value avec alert juste après l'appel de manageDiv et là il me dit '-' alors que visuellement parlant la valeur du bouton reste '+'  :pt1cable:

Message cité 1 fois
Reply

Marsh Posté le 05-01-2009 à 19:25:25    

Modération a écrit :


Oui, merci.
Sinon, tu as quelque chose d'un peu plus intéressant à dire ?


 
Quel est l'intérêt de tester d'une part Internet Explorer et d'autre part sa version "non-officiel" ?
Ca fait partit des risques :/
 
Si sont codes fonctionnent sur FF , Opera , Chrome , http://upload.wikimedia.org/wikipe [...] owsers.svg
 
C'est bon pour moi ;)

Reply

Marsh Posté le 05-01-2009 à 19:25:25   

Reply

Marsh Posté le 05-01-2009 à 22:51:51    


 
'tain ...  :heink:
IE8 "aurait" un problème de mise-à-jour dynamique d'élements d'une page ?!  :sweat:  
 
Et tu disais que ton <div id="more"> "s'ouvrait" quand même mais était vide ?
 
( désolé de pas pouvoir tester en même temps mais, pour éviter le troll, je vais juste dire que "actuellement, je ne suis pas en mesure de tester sous IE"  :whistle:  )

Message cité 1 fois
Reply

Marsh Posté le 05-01-2009 à 22:58:46    

Et sous IE 7 ça fonctionne ?  :??:

Message cité 1 fois
Message édité par FR-DarkRod le 05-01-2009 à 22:58:58
Reply

Marsh Posté le 06-01-2009 à 18:04:14    

Mr Mala a écrit :


 
'tain ...  :heink:
IE8 "aurait" un problème de mise-à-jour dynamique d'élements d'une page ?!  :sweat:  
 
Et tu disais que ton <div id="more"> "s'ouvrait" quand même mais était vide ?
 
( désolé de pas pouvoir tester en même temps mais, pour éviter le troll, je vais juste dire que "actuellement, je ne suis pas en mesure de tester sous IE"  :whistle:  )


 
Oui la div s'ouvre... mais reste vide.
je comprends pas bien ce qu'il se passe mais merci de ton aide ;)
 

FR-DarkRod a écrit :

Et sous IE 7 ça fonctionne ?  :??:


 
j'ai pas IE 7 et je sais pas ou télécharger la version pour vista  :pfff:

Reply

Marsh Posté le 06-01-2009 à 18:15:47    

Sérieux ?

 

Normalement c'est intégré :o

 

http://www.01net.com/telecharger/w [...] 33081.html

 

:)

 

(ne me remercie pas http://darkrodspace.free.fr/images/noel.gif )


Message édité par FR-DarkRod le 06-01-2009 à 18:17:09
Reply

Marsh Posté le 06-01-2009 à 18:22:10    

sauf que c'est la version Windows XP [:dawa]
Et que l'install de IE 8 écrase IE 7 [:dawa]

Reply

Marsh Posté le 06-01-2009 à 18:35:47    

abba ... c'est foutu ^^

 

maintenant il faut formater :o


Message édité par FR-DarkRod le 06-01-2009 à 18:36:02
Reply

Marsh Posté le 06-01-2009 à 19:23:03    

Bon mauvaise nouvelle...
Je viens de tester sur un IE7 et ça passe ..
Le passage + / - pour le bouton et l'ouverture + affichage de la div ..
Maintenant dans le div, j'ai juste tapé un paragraphe de lorem ipsum , pas une structure complexe ...
 
Ta page est quelque-part en ligne pour pouvoir tester ?

Reply

Marsh Posté le 07-01-2009 à 12:49:05    

oui mais avec un interface d'administration à laquelle je suis seul à avoir accès (enfin j'espère :o)

Reply

Marsh Posté le 07-01-2009 à 13:09:02    

Ouais on peut avoir tester stp ? :o

Reply

Marsh Posté le 07-01-2009 à 13:11:13    

non mais considérez ce sujet comme clos, tant que çà marche sous IE 7...
:jap:

Message cité 1 fois
Reply

Marsh Posté le 07-01-2009 à 13:12:25    

On peut essayez où ?

Reply

Marsh Posté le 07-01-2009 à 13:13:43    

j'ai donné les scripts ;)

Reply

Marsh Posté le 07-01-2009 à 13:14:24    


 
Heuuu oui enfin je te dis, j'ai juste c/c ton code ici plus haut pour tester dans une p'tite page html minable hein !
Faut voir si TA page n'a pas un autre problème.
 
Enfin, si pour toi c'est ok, tant mieux ! ;-)

Reply

Marsh Posté le 07-01-2009 à 13:15:29    

Oh la flème de taper le code http://darkrodspace.free.fr/images/noel.gif

Reply

Marsh Posté le 07-01-2009 à 13:48:23    

Bon, voilà le HTML généré (pas d'URL, c'est une page d'administration ;))
 

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Lucasavoie.com | Administration | Edition de page</title>
  6. <link rel="icon" href="favicon.gif" type="image/gif" />
  7. <link rel="stylesheet" href="style.css" media="all" />
  8. <script type="text/javascript"
  9.         src="js/bbcode.js">
  10. </script>
  11. <script type="text/javascript">
  12.     function manageDiv(name) {
  13.         visible = document.getElementById(name).style.display;
  14.         
  15.         if(visible == 'none') {
  16.             document.getElementById(name).style.display = 'block';
  17.             return false;
  18.         } else {
  19.             document.getElementById(name).style.display = 'none';
  20.             return true;
  21.         }
  22.     }
  23.     
  24.     window.onload = function() {
  25.         manageDiv('more');
  26.     }
  27. </script>
  28. </head>
  29.  
  30. <body>
  31. <div id="header">
  32.  
  33. Lucasavoie.com</div>
  34.  
  35. <div id="main">
  36. <div id="colonne1">
  37. <ul class="menu">
  38.     <li>Le Site</li>    <li> - <a href="page.php?id=1">Accueil</a></li>
  39.     </ul>
  40. </div>
  41.  
  42. <div id="colonne2">
  43. <form action="search.php" method="get">
  44. <input type="text" name="search" id="search" /><br />
  45. <input type="submit" value="Rechercher" />
  46. </form>
  47.  
  48. <hr />
  49.  
  50. <a href="admin.php">Administration</a></div>
  51.  
  52. <div id="centre">
  53. <h3>Administration - Edition de page</h3>
  54.  
  55. <form action="admin_edit_page.php" method="post" name="formulaire">
  56. <input type="hidden" name="id" value="1" />
  57.  
  58. <table>
  59. <tr>
  60.     <td class="legend">Titre de la page</td>
  61.     <td><input type="text" name="title" value="Accueil" /></td>
  62. </tr>
  63. <tr>
  64.     <td class="legend">Nom de la page</td>
  65.     <td><input type="text" name="name" value="Accueil" /></td>
  66. </tr>
  67. <tr>
  68.     <td class="legend">Cat&eacute;gorie</td>
  69.  
  70.     <td>
  71.     <select name="category">
  72.                         <option value="1" selected="selected">Le Site</option>
  73.                         <option value="2" >Randos</option>
  74.             </select>
  75.     </td>
  76. </tr>
  77. <tr>
  78.     <td class="legend">Formatage</td>
  79.  
  80.     <td>
  81.     <input type="button" id="gras" name="gras" value="Gras" onClick="javascript:bbcode('', '');" />
  82.     <input type="button" id="italic" name="italic" value="Italique" onClick="javascript:bbcode('', '');" />
  83.     <input type="button" id="italic" name="italic" value="Souligné" onClick="javascript:bbcode('', '');" />
  84.     <input type="button" id="image" name="image" value="Image" onClick="javascript:bbcode('[img]', '[/img]');" />
  85.     <input type="button" id="lien" name="lien" value="Lien" onClick="javascript:bbcode('', '');" />
  86.     <input type="button" id="p" name="p" value="§" onClick="javascript:bbcode('[align='+prompt('Choisissez un alignement : left, center, right, ou justify.')+']', '[/align]');" />
  87.     <input type="button" id="plus" name="plus" value="+" onclick="
  88.     this.value = (manageDiv('more')) ? '+' : '-';" />
  89.     <div id="more">
  90.  
  91.     <input type="button" id="fontsize" name="fontsize" value="Taille" onclick="javascript:bbcode('[font size=16px]', '[/font]');" />
  92.     <input type="button" id="color" name="color" value="Couleur" onclick="javascript:bbcode('[color=#000]', '[/color]');" />
  93.     <input type="button" id="youtube" name="youtube" value="Youtube" onclick="javascript:bbcode('[youtube]', '[/youtube]');" />
  94.     </div>
  95.     </td>
  96. </tr>
  97. <tr>
  98.     <td class="legend">Contenu</td>
  99.     <td><textarea name="content" cols="55" rows="10" id="textarea">(texte avec bbcode)</textarea></td>
  100.  
  101. </tr>
  102. <tr>
  103.     <td class="legend">V&eacute;rifiez le contenu.</td>
  104.     <td><input type="submit" value="Enregistrer" /></td>
  105. </tr>
  106. </table>
  107. </form>
  108. </div>
  109. </div>
  110.  
  111. <div id="footer">
  112. Lucas GAUTHERON &copy; 2008 - <a href="http://validator.w3.org/check?uri=referer&amp;charset=(detect+automatically)&amp;doctype=Inline&amp;group=0&amp;user-agent=W3C_Validator%2F1.606">xHTML Valid</a> | <a href="http://jigsaw.w3.org/css-validator/validator?uri=referer&amp;profile=css21&amp;usermedium=all&amp;warning=1&amp;lang=fr">CSS Valid</a> | 0.023363 secondes.
  113.  
  114. </div>
  115.  
  116. </body>
  117. </html>

Reply

Marsh Posté le 07-01-2009 à 14:14:07    

ok ben je confirme, je viens de tester sur un IE7 et ça passe sans problème ...
Il semblerait donc bien que ça soit un problème IE8 ... maintenant, comme ça a été dit, ça reste une béta ...
 
edit: d'un autre côté, sans vouloir troller, quelle idée aussi d'installer du Microsoft béta !  :whistle:


Message édité par Mr Mala le 07-01-2009 à 14:15:11
Reply

Marsh Posté le 07-01-2009 à 14:15:21    

ok bah merci ;)

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

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