Menu JS ne fonctionne pas sous IE7 si présence de Doctype

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Menu JS ne fonctionne pas sous IE7 si présence de Doctype

san_

Bonjour,

Le site web que je dois faire dans le cadre de mes études est pratiquement terminé, mais en testant la compatibilité avec les navigateurs j'ai découvert un problème embêtant. Le menu déroulant JS du site est "décalé" sous IE7 si j'inclus un DOCTYPE dans ma page.
(un aperçu du site est disponible ici, constatez vous même : http://bro29.free.fr).

Par contre, si j'enlève le doctype (XHTML 1.0 transitional), tout fonctionne comme sous FF et IE6.
Savez vous d'où ca pourrait venir ?

Code JS :

Code :

var menu_timer, menu_current;
var no_timer = false;
function ms(s)
{
clearTimeout(menu_timer);
if (menu_current!=null && menu_current != s) _mh(menu_current);
document.getElementById(s).style.visibility = "visible";
menu_current = s;
}
function _mh(s)
{
var e = document.getElementById(s);
e.style.visibility = "hidden"
e.no_timer = false;
menu_current = null;
}
function mh(s)
{
if (!document.getElementById(s).no_timer) menu_timer = setTimeout("_mh('"+s+"')",1000);
}
function drawMenu(ml)
{
for (i=0; i<labels.length; i++)
{
var l = labels[i];
if (l!=ml)
{
var s = 'onMouseOver="ms(\''+l+'\')" onMouseOut="mh(\''+l+'\')"';
if (window.editMode) s = '';
document.write('<td width="150"><img src="'+imgPrefix+l+'.gif" '+s+'/><br/><div class="submenu" id="'+l+'">');
for (j=0; j<menus[i].length; j++)
{
document.write('<div><a '+s+' href="'+htmlPrefix+l+'/'+menus[i][j][1]+'.html">'+menus[i][j][0]+'</a></div>');
}
document.write('</div></td>');
}
else document.write('<td width="150"><img src="'+imgPrefix+l+'.gif"/></td>');
}
}

Code CSS :

Code :

td.menuhome {width: 100%;
height: 31px;
vertical-align: top;
padding: 0px;}
td.menu {width: 100%;
height: 30px;
vertical-align: top;
padding: 0px;}
.submenu {position: absolute;
visibility: hidden;
padding: 0px;
margin: 0px;
width: 150px;}
.submenu div {font-size: 11px;
font-weight: bold;
padding: 4px 0px 4px 10px;
border-top: 1px solid white;}
#accueil div {background-color: #658fbe;}
#adminis div {background-color: #9287af;}
#pedago div {background-color: #65ab5a;}
#vielycee div {background-color: #d088af;}
#contacts div {background-color: #9dc2d7;}

Merci d'avance pour votre aide :sweat:

Publicité

anapajari

s/travail/glanding on hfr/gs;

http://www.quirksmode.org/css/quirksmode.html

san_

Oui je connais ça mais je ne m'explique pas pourquoi IE7 est le seul qui n'affiche pas correctement mon menu
J'ai testé : Safari, IE6, FF, Opéra.. tout marche.

Pitsy

ça ressemble fort à un problème de positionnement absolu non défini mais interprêté par le navigateur. IE tenant compte du centrage pour interprété la position supposée de l'élément en l'absence d'un left:... ou right:...

En général il suffit de rajouter un left:0; pour règler le problème mais vu ton menu obsolète à base de montage en tableau sans position relative précisée je crains que cela pose problème genre tous tes sous-menus collés à droites.

Pour moi 2 options:

- ajouter un style="position:relative;" sur le td qui contient le menu (m'étonnerais que ça marche il me semble déjà avoir observé le cas foireux)

- ajouter un style="text-align:left;" sur le même td pour essayer de récupérer sur IE7 (mais ton montage restera du bricolage):

Code :

.menuhome td {text-align:left;}

san_

chapeau bas, le menu marche maintenant, merci beaucoup :jap:
Pourquoi penses tu que ce menu est obsolète ? (je précise qu'il n'est pas de moi, je ne maîtrise pas trop le js encore..)

Message cité 1 fois
Message édité par san_ le 06-06-2007 à 19:42:03

Pitsy

san_ a écrit :

Pourquoi penses tu que ce menu est obsolète ? (je précise qu'il n'est pas de moi, je ne maîtrise pas trop le js encore..)

Je ne maîtrise pas le javascript des masses non plus

C'est 2 choses qui m'ont fait dire ça, plus dans la conception générale du menu que dans la programmation elle-même:

- l'utilisation d'une mise en page à l'aide de tableau ou de div superflus
- la construction complète du menu en javascript qui va à l'encontre des règles d'accessibilité et d'un référencement efficace

FORUM HardWare.fr

Programmation

HTML/CSS

Menu JS ne fonctionne pas sous IE7 si présence de Doctype

Sujets relatifs
debutant HTML prob IE7	Menu + classe + xml
[Résolu] CSS : je voudrais une width (100%-largeur menu)	menu php
Problème avec DOCTYPE html PUBLIC	[EXCEL] Menu déroulant et variable ?
Bug Menu IE 6 (marche sous FF et IE7)	Grosse Macro ne fonctionne plus
Plus de sujets relatifs à : Menu JS ne fonctionne pas sous IE7 si présence de Doctype

Page générée en 0.054 secondes