18068 sujets

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

Menu déroulant horizontal sur une ligne [Résolu]

Bonsoir

J'utilise le menu déroulant horizontal sur une ligne. Et je voudrais qu'à l'affichage de ma page l'un des sous-menus reste afficher puis lorsque l'on passe en rollover sur les autres rubriques du menu, les sous-menu corresondant s'affichent mais laisse la place au sous-menu affiché par défaut en rollout.
Comment faire ? Smiley mur

Soit dit en passant merci pour :
- le site alsacreations
- le forum
- le livre...
Modifié par tarahunt (21 Sep 2005 - 14:11)
... on dirait que mon message ne vous inspire pas pour le moment.
En fait mon problème se situe je pense dans le javascript puis dans les sous-menus en CSS...

Je m'explique

Dans l'en-tête on a ce code

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>


Puis dans le corps de la page on a le code suivant pour afficher les sous-menus


<div id="menu">
	<dl>
		<dt onmouseover="javascript:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>

	</dl>
	
	<dl>			
		<dt onmouseover="javascript:montre('smenu1');">Menu </dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">Sous-Menu 1.1</a></li>

					<li><a href="#">Sous-Menu 1.2</a></li>
					<li><a href="#">Sous-Menu 1.3</a></li>
					<li><a href="#">Sous-Menu 1.4</a></li>

					<li><a href="#">Sous-Menu 1.5</a></li>
					<li><a href="#">Sous-Menu 1.6</a></li>
				</ul>

			</dd>
	</dl>
	<dl>	
		<dt onmouseover="javascript:montre();"><a href="">Menu 2</a></dt>
	</dl>

	
	<dl>	
		<dt onmouseover="javascript:montre('smenu3');">Menu 3</dt>
			<dd id="smenu3">
				<ul>
					<li><a href="#">Sous-Menu 3.1</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>
bla bla bla (pour la suite des autres sous-menus)
</div>


Je voudrais faire en sorte que le sous-menu 1 soit affiché au chargement de la page.
Et lors d'un passage en MouseOver sur un autre titre de rubrique d'afficher le sous-menu correspondant qui laisse la place au sous-menu 1 en cas de rollOut.

Help ??

Exemple de réalisation : http://css.alsacreations.com/xmedia/exemples/deroulant/cssmenu3.htm
Salut,

Tu peux appeler ta fonction montre('tonsousmenu') dans ton body avec onload

ex:
<body onload="javascript:montre('smenu1');">
ou rajouter la fonction onmouseout à celle onmouseover :
<onmouseout="javascript:montre('smenu1');">
(la solution du "body onload" n'affichera directement ton menu 1 qu'au chargement de la page, mais je ne suis pas sûr que ça le ramène au rolll" out").
Merci les gars !!!!
Ca marche c'est impec. J'avoue que c'était très con et que j'aurais dû y penser mais y'a des jours, quand on est trop dans le code, on ne voit rien.
J'ai finalement renoncé au détail du sous-menu qui réapparaît en Rollout parce qu'ergonomiquement c'était merdique.

Merci pour tout.

PS : je suis une fille.
Modifié par tarahunt (14 Sep 2005 - 09:47)
Bonjour à vous !

J'utilise les mêmes codes que tarahunt sauf que moi je voudrai justement que les sous-menus appelés, une fois affichés, disparaissent automatiquement (au bout de 2 secondes), sans que l'on soit obligé de se placer sur un autre lien du menu qui ne possède pas de sous-menus...

Pour être plus clair sur ce que ça donne actuellement :
http://www.e-central.fr/test/test2.html
Modifié par lordbdp (20 Sep 2005 - 01:14)
Sujet clos
Aller à