Version complète: sur le forum Webmaster Hub : Onclick OK avec IE et KO avec Firefox
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
francoisch
mercredi 13 août 2008 à 10:02
Bonjour

J’ai une page qui affiche 15 boutons :
• Avec IE7, le clic sur tous ces boutons fonctionne, le hover aussi (la couleur change)
• Avec Firefox, pour 4 boutons, le clic et le hover ne fonctionnent pas

Des remarques concernant uniquement Firefox :
- les boutons qui ne fonctionnent pas : les 4 premiers, qui utilisent la classe bleu1bleu2
- une autre bouton (accessoire) utilisant la même classe fonctionne
- les autres fonctionnent tous

Voici la table complète, et un peu longue, contenant les boutons :
CODE
<table border="0" cellpadding="3" cellspacing="3" align="center" width="100%">
<tr>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../messagerie.php?repertoire=martinot'" class="bouton3_bleu1bleu2">La<br>messagerie</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../web.php?repertoire=martinot'" class="bouton3_bleu1bleu2">le Web</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../conversation.php?repertoire=martinot'" class="bouton3_bleu1bleu2">Conversations</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../bureautique.php?repertoire=martinot'" class="bouton3_bleu1bleu2">Ma<br>bureautique</button></td>
</tr><tr><td align="center" width="25%"><button type="button" onclick="document.location.href='../musique.php?repertoire=martinot'" class="bouton3_rose1rose2">Mes<br>musiques</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../photo.php?repertoire=martinot'" class="bouton3_rose1rose2">Mes<br>photos</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../loisirs.php?repertoire=martinot'" class="bouton3_rose1rose2">Mes<br>loisirs</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../video.php?repertoire=martinot'" class="bouton3_rose1rose2">Mes<br>videos</button></td>
</tr><tr><td align="center" width="25%"><button type="button" onclick="document.location.href='../jeux.php?repertoire=martinot'" class="bouton3_rose1rose2">Mes<br>jeux</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../tv.php?repertoire=martinot'" class="bouton3_rose1rose2">Ma<br>TV</button></td>
<td align="center" width="25%"><button type="button" onclick="document.location.href='../accessoire.php?repertoire=martinot'" class="bouton3_bleu1bleu2">Mes<br>accessoires</button></td>
<td align="center" width="25%"><a href="java script:afficherep ()" class="bouton3"> <img src="../image/r_reperes2.jpg" alt="Repères" align="middle" class="image_fam2"></a></td>
</tr><tr><td align="center" width="25%"><a href="java script:affichecah ()" class="bouton3"> <img src="../image/r_cahiers2.jpg" alt="Cahiers" align="middle" class="image_fam2"></a></td>
<td align="center" width="25%"><a href="java script:affichecarnet ()" class="bouton3"> <img src="../image/r_carnets2.jpg" alt="Carnet" align="middle" class="image_fam2"></a></td>
<td align="center" width="25%"><a href="java script:affichecommun ()" class="bouton3"> <img src="../image/r_commun2.jpg" alt="Commun" align="middle" class="image_fam2"></a></td>
</tr>
</table>


Je n’arrive pas à trouver l’erreur.

Merci par avance de votre aide.

Francois
Portekoi
mercredi 13 août 2008 à 10:18
Bonjour,

Si cela ne fonctionne pas avec les 4 derniers liens, remplace ceci :

CODE
<a href="java script:affichecarnet ()" class="bouton3">


par cela pour les 4 :

CODE
<a href="#" onClick="java script:affichecarnet ()" class="bouton3">


Et vérifie que tes fonctions existent bien.


Portekoi
francoisch
jeudi 14 août 2008 à 10:34
bonjour et merci de ta réponse.

En fait, mon problème se situe dans les 4 premiers boutons et pas dans les 4 derniers.

En gros, tous les Buttons sont construits de la même manière, certains coloriés en bleu, d'autres en rose.

Parmi les Buttons bleus, les 4 premiers ne fonctionnent pas avec Firefox; par contre, le bouton accessoire fontionne bien, lui.

Mon Firefox est une version Portable 2.0.0.14.

Aussi, avec IE7, ils fonctionnent tous très bien.

Je sèche; aussi, merci de votre aide.

Francois
francoisch
jeudi 14 août 2008 à 18:16
Qqes infos supplémentaires:
- après avoir passé le 4e bouton, qui ne fonctionnait pas, au deuxième rang du tableau, il fonctionne
- sur une autre page, toujours avec FF, j'ai le même problème des boutons du premier rang qui ne fonctionnent pas

Ca ressemble à un truc stupide; j'ai besoin de votre aide, par avance merci.

Avec IE7, tout fonctionne.

Francois
Portekoi
jeudi 14 août 2008 à 21:43
Peut être tout bête mais remplace ceci :

CODE
<button type="button"


Par cela :

CODE
<input type="button"
francoisch
vendredi 15 août 2008 à 10:51
Hé Non, j'ai besoin de Button car ça me permet de mettre dans le bouton un libellé sur 2-3 lignes (avec des <br>), ce qui me permet d'écrire en gros caractères (pour des personnes âgées).

Francois
Portekoi
vendredi 15 août 2008 à 12:20
Fais juste le test pour voir si cela ne viendrais pas de là...

Et si oui, tu peux utiliser du CSS pour grossir la police....
francoisch
samedi 16 août 2008 à 11:36
bonjour

J'ai une piste:
- quand j'enlève ce code ci dessous, ça marche avec Firefox:
CODE
<div id="menu">
<dl>
<dt onmouseover="java script:montre('smenu1');">Gestion</dt>
<dd id="smenu1" onmouseover="java script:montre('smenu1');" onmouseout="java script:montre('');">
<ul>
    <li><a href="espace_commun.php"  >Espaces communs</a></li>
</ul>
</dd>
</dl>
</div>

mais, naturellement, j'ai besoin de ce code.

Pour mémoire:
- le non fonctionnement des boutons avec FF n'affecte que ceux de la première ligne de la table (pourquoi eux seulement?)
- ça marche dans tous les cas avec IE7

Dans la CSS:
CODE
dl, dt, dd, ul, li { margin: 0; padding: 0; list-style-type: none; }
#menu { position: absolute; left: <?=$decalage1?>px; z-index:10; width: 100%; }
#menu dl { float: left; width: <?=$marge1?>px; }
#menu dt { cursor: pointer; text-align: center; font-weight: bold; color: <?=$bleu?>; background: <?=$gris?>; border: 1px solid gray; margin: 1px; }
#menu dd { display: none; border: 1px solid gray; margin: 1px; }

En espérant que ça vous aide à trouver l'erreur.

Francois
-------------------------------------------------------------
Deux précisions:
- j'ai ajouté une première ligne vide avec 5 cellules mais sans Button dans ma table: sans effet, ça ne fonctionne tjs pas avec FF
- ce disfonctionnement FF se produit sur une autre page, la seule qui ait aussi un menu construit comme celui montré plus haut

Francois
-------------------------------------------------------------
Oui, je peux grossir la police avec la CSS mais Input ne permet pas, je crois, d'écrire sur 2-3 lignes dans le bouton, ce qui est nécessaire quand on écrit gros.

Francois
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.