28221 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,

J'ai un petit soucis avec les menus déroulants. En effet, lorsque j'ouvre un menu, celui-ci ne se referme que si je revient sur le menu "acceuil".

J'aimerais qu'il se referme dés que je quiite la liste des sous menus.

EXEMPLE:

upload/236-base.gif

MON CODE XHTML: (tuto Asacréation)

<div id="menu">
	<dl>
		<dt onmouseover="javascript:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>
	</dl>
	
	<dl>			
		<dt onmouseover="javascript:montre('smenu1');">XHTML</dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">Introduction</a></li>
					<li><a href="#">Doctype</a></li>
					<li><a href="#">Texte</a></li>
					<li><a href="#">images</a></li>
					<li><a href="#">Liens</a></li>
					<li><a href="#">Conclusion</a></li>
				</ul>
			</dd>
	</dl>
	
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu2');">CSS</dt>
			<dd id="smenu2">
				<ul>
					<li><a href="#">Introduction</a></li>
					<li><a href="#">Blocs</a></li>
					<li><a href="#">Texte</a></li>
					<li><a href="#">images</a></li>
					<li><a href="#">Liens</a></li>
					<li><a href="#">Conclusion</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu3');">JavaScript</dt>
			<dd id="smenu3">
				<ul>
					<li><a href="#">Introduction</a></li>
					<li><a href="#">Sous-Menu 3.2</a></li>
					<li><a href="#">Sous-Menu 3.3</a></li>
					<li><a href="#">Sous-Menu 3.4</a></li>
					<li><a href="#">Sous-Menu 3.5</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu4');">Menu 4</dt>
			<dd id="smenu4">
				<ul>
					<li><a href="#">Sous-Menu 4.1</a></li>
					<li><a href="#">Sous-Menu 4.2</a></li>
					<li><a href="#">Sous-Menu 4.3</a></li>
				</ul>
			</dd>
	</dl>


MON CODE CSS: (tuto Asacréation)

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 18%;
left: 29%;
z-index:100;
width: 100%; /* correction pour Opera */
}
#menu dl {
Float: left;
width: 7em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #c4ceee;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
}
#menu li {
text-align: left;
background: #f5f5fc;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
background: #babdec;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray; 
}


Merci des conseils que vous voudrez bien m'apporter.
Modifié le 02 Dec 2004 - 00:31
Administrateur
a écrit :

J'aimerais qu'il se referme dés que je quiite la liste des sous menus.

Salut,

Je crois que le meilleur conseil que je puisse donner est de lire les tutos jusqu'au bout Smiley smile
Bonsoir,
Je vois que désormais tu es un pro de l'insertion de capture et que comme El Mou...( Smiley langue ) te le conseillais tu es passé à Firefox Smiley cligne
Raphael a écrit :

J'aimerais qu'il se referme dés que je quiite la liste des sous menus.

Salut,

Je crois que le meilleur conseil que je puisse donner est de lire les tutos jusqu'au bout Smiley smile

Merci Raphael, décidément tes conseils sont toujours judicieux, mission accomplie et réussite totale.

j'essairais d'éviter ce genre d'erreur à l'avenir, vitesse et précipitation ne vont effectivement pas bien ensemble.
Igor a écrit :
Bonsoir,
Je vois que désormais tu es un pro de l'insertion de capture et que comme El Mou...( Smiley langue ) te le conseillais tu es passé à Firefox Smiley cligne


Bosoir igor,

Ben oui, un dessin vaut mieux que de beaux discours pour se faire comprendre!

Et les conseils judicieux dispensés par des pros se doivent d'être toujours suivis.

Merci à tous pour votre aide.