Div visibility hidden / visible ne marche pas sous IE ?

Bonjour,

Un petit exemple vaut mieux que des longues explications.
Pour faire simple, mon script fonctionne parfaitement sous firefox mais pas du tout sous IE.

Lien vers la page pour voir

Si vous cliquez sur DBA Oracle (ou n'importe quel titre), sous firefox, ca affiche l'annonce, sous IE ca n'affiche rien.

le javascript prend bien en compte la paramétre (si je fais un alert de baliseId)

Le code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script>
function cacheId(baliseId)
{
if (document.getElementById && document.getElementById(baliseId) != null)
{
document.getElementById(baliseId).style.visibility='hidden';
document.getElementById(baliseId).style.display='none';
}
}
function afficheId(baliseId)
{
if (document.getElementById && document.getElementById(baliseId) != null)
{
 
 
document.getElementById(baliseId).style.visibility='visible';
document.getElementById(baliseId).style.display='block';
 
}
}
</script>

les balises html (juste le DBA oracle pour l'exemple) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<tr>
                    <td>
                      28-11-2007 
                    </td>
                    <td>
                      <div>
                        <a href="javascript:afficheId('contenu0')">DBA ORACLE H/F</a>
                      </div>
                    </td>
                    <div id='contenu0' style="display:none" >
                      <br>
                      <strong>
                        <font color=#185782>
                          DBA ORACLE H/F
                        </font></strong>
                      <br>
                      <strong>Date de Parution : </strong>
                      28-11-2007
                      <br>
                      <strong>Ville : </strong>
                      Niort
                      <br>
                      <br>                      Vous recherchez une implantation locale stable et souhaitez intégrer un groupe aux valeurs humaines ?                      Alors rejoignez-nous pour partager nos convictions telles que la confiance, la transparence, la convivialité et la proximité.
                      <br />
                      <br />                      Néo-Soft IS, société jeune et dynamique, vous propose d'intervenir sur des projets technologiques innovants pour l'ensemble de ses clients de la région Nantaise.
                      <br />                      Pour accompagner un de nos partenaires nous recherchons un administrateur Linux/Unix, expérimenté en la mise en service de HP Service Center. La connaissance de système d’exploitation AIX serait fortement appréciée.
                      <br />
                      De formation Bac+ 2-3, vous disposez de compétences en Administration de systèmes Unix ainsi que d’outils de supervision tels que HP OpenView ou Nagios….
                      <br />
                      <br />                      Vos aptitudes dans la coordination de projet seront un plus significatif à votre candidature.
                      Réellement dynamique, autonome et moteur, votre sens du contact et vos qualités humaines feront la différence.
                      <br>
                      <br>
                      <div>
                        <a href="javascript:cacheId('contenu0')">
                          <font color=red>
                            Fermer
                          </font></a>
                        <hr>
                      </div>
                    </div>
                    <td>
                      Niort
                    </td>
                  </tr>

le style semble bien être modifié sous IE mais pas pris en compte.

Une idée ?

Merci !

Edit : j'ai testé en supprimant le tableau autour mais sans succés.

salut
tu peut régler ce problème par deux methode , soit tu remplace l'attribut Visibility='hidden' par Display='none'
ou bien tu applique une class css a ton div et tu le change dans javascript
exemple
code css
Code:

1 2 3 4 5 6 7 8 9 .tumevoispas { visibility: hidden; } .tumevois { visibility: visible; }
code javascript
Code:

1 2 3 4 5 <script languge="javascript"> document.getElementById('le id de div caché').className="tumevoispas"; document.getElementById('le id de div visible').className="tumevois"; </script>
<div id="'le id de div visible"> salut</div>
<div id="'le id de div caché"> aurevoir</div>

Merci, ca fonctionne mieux mais toutefois, on voit le bloc caché en tant que gros bloc blanc (puisque je ne mets plus display : none; qui ne fonctionne pas avec IE).
Comment faire pour minimiser ce bloc "blanc vide" quand le bloc est caché ?

MErci

change dans le css 'visibility' par 'display', 'hidden' par 'none', 'visible' par 'block' ...

et la propriété javascript style.display marche très bien sour IE

Impec, merci à tous !

tu peut ajouter la proprieté height a ton css comme ce lui la
.tumevoispas
{
visibility: hidden;
hieght:0px;
}
.tumevois
{
visibility: visible;
hieght: 100 px ;
}