18073 sujets

Questions générales et questions de débutants

Menu horizontal : le menu déroulant ne se referme pas...

... Après passage de la souris !

J'ai utilisé ce menu :
http://css.alsacreations.com/Construction-de-menus-en-CSS/Un-menu-deroulant-en-CSS-et-XHTML-vertical-et-horizontal

J'ai complété par le conseil qui est donné en bas pour la fermeture après le passage de la souris :
<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">

Mais ça ne fonctionne pas !

1. le menu déroulé ne se referme pas si je vais ailleurs que sur un autre menu

2. le lien dans le menu déroulé ne marche que sur le 1er item !

Quelqu'un a-t-il déjà rencontré ce type de problème ?
Je viens de refaire tout le code étape par étape pour voir ce qui n'allait pas. Je ne modifie rien à part de la mise en forme (typo, suppression bordure, padding dans les <dt>).

Le bug se situe ici : dans la liste des sous menu j'intègre l'attribut suivant :

#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
font-family: Tahoma, Arial;
[#red]font-size: 11px; 
}


Suivant que je le mette ou l'enlève, le lien marche ou non plus loin que le 1er item de la liste !!!

Quelqu'un a-t-il une idée ?
Je continue toute seule, ça peut servir à d'autre ...

Le plus extraordinaire : si je mets le font-size à 12px (= la propriété par défaut) ça ne marche pas non plus : il n'y a que le 1er lien qui fonctionne. Je constate par ailleurs que cela influe très légèrement sur l'interlignage dans le sous-menu...
Alors personne n'a une idée sur ce problème ! Pourtant je ne dois pas être la seule a vouloir changer les typo de ce menu !!
Eh bien mon problème ne semble pas passionner les foules !!

Je viens de tester encore autre chose en laissant le menu sans changement de la taille de la typo : 

#menu li a, #menu dt a {
	color: #000;
	text-decoration: none;
	display: block;
	[#red]height: 90%; 
	[#black]border: 0 none;
	font-family: Tahoma, Arial;
}


Ca créée le bug aussi ... Je dois dire que je ne comprends pas trop ce que vient contrôler cette propriété ici.

N'y-a-il personne ici qui ait voulu changer la typo du menu ?
Merci de me venir en aide...
Je continue ma discussion toute seule ! J'ai trouvé une solution très propre sur... un autre site. Et sans javascript s'il vous plait ! Fonctionne impécablement sous
- IE 6.0
- Firefox 1.7
- Netscape 7.0
(je n'ai que ces 3 browsers).
Les typos et les couleurs peuvent être paramétrées individuellement sans problème (par exemple une couleur par menu et une autre couleur par sous-menu).

Voici l'adresse : http://www.seoconsultants.com/css/menus/tutorial/
Régalez-vous !
Je sais pas si ça peut t'aider, mais j'avais été confronté à un problème pour la fermeture des menus déroulants, ici...

kantega,,,
caroder a écrit :
Et sans javascript s'il vous plait !

Bonjour,
La solution dont tu parles utilise un fichier .htc qui commence par 
<attach event="ondocumentready" handler="parseStylesheets" />
<script>
et finit par 
</script>
, et qui donc ne marchera pas non plus si JavaScript est désactivé sous IE (on ne pourrait donc plus atteindre les sous-menus.)

La seule solution sans JS pour IE serait éventuellement cela : http://www.cssplay.co.uk/menus/dd_valid.html
Modifié par Alan (13 Mar 2006 - 19:41)
Alan a écrit :

Bonjour,
La seule solution sans JS pour IE serait éventuellement cela : http://www.cssplay.co.uk/menus/dd_valid.html

Bonjour,
Je pensait que c'était impossible car ça oblige à mettre des liens dans d'autres liens.
Je remarque qu'ils y arrivent à coups de liste incorporée dans un tableau et 
 <!--[if lte IE 6]>
    <a class="sub" href="../menu/hover_click.html" title="Hover/click with no active/focus borders">HOVER/CLICK &gt;
    <table><tr><td>
    <![endif ]-->

C'est scabreux et pas propre, et ça ne fonctionne pas sur IE5, IE5.5/win (test avec version standalone)
Modifié par chmel (14 Mar 2006 - 13:12)
Salut,
En fait le principe marche avec IE 5.x. L'auteur a fait de manipulations récentes, et peut être une erreur ? L'autre version marche toujours : http://www.cssplay.co.uk/menus/dropdown.html
En revanche, pas avec IE Mac.

Sur le "scabreux et pas propre", il ne faut pas oublier que le site s'appelle "css play", qu'il s'agit donc d'une sorte de cour de récréation expérimentale.
Modifié par Alan (14 Mar 2006 - 13:46)
Alan a écrit :
Salut,
récréation expérimentale.

Donc pas vraiment exploitable Smiley ohwell
Merci Alan pour l'info
Sujet clos
Aller à