Flux rss
Collection CommentCaMarche.net
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

Menu horizontal déroulant

  milene76, le lundi 5 février 2007 à 15:52:48
Bonjour,

Voila je n'arrive pas a afficher les sous menus?????

Voici mon code :

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<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>

<style type="text/css" media="screen">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* placement du menu, à modifier selon vos besoins */
top: 0;
left: 0;
z-index:100;
width: 100%; /* correction pour Opera */
}
#menu dl {
float: left;
width: 12em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#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: #eee;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}
-->
</style>

</head>

<body>
<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 1</dt>

<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">
<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('smenu2');">Menu 2</dt>

<dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre('');">
<ul>
<li><a href="#">Sous-Menu 2.1</a></li>
<li><a href="#">Sous-Menu 2.2</a></li>
<li><a href="#">Sous-Menu 2.3</a></li>
<li><a href="#">Sous-Menu 2.4</a></li>
</ul>

</dd>
</dl>

<dl>
<dt onmouseover="javascript:montre('smenu3');">Menu 3</dt>
<dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre('');">
<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" onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre('');">
<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>


</body>
</html>


Par avance merci pour votre aide!

Milène
Configuration: Windows XP
Internet Explorer 7.0
Répondre à milene76  Signaler ce message aux modérateurs

Résultats pour menu horizontal déroulant

Conflit feuilles de style menu lightbox (Résolu) Bonjour à tous, J'ai un problème de conflit entre deux feuilles de style. La première concerne un menu horizontal déroulant (javascript), la seconde un script lightbox pour l'affichage de mes images. Dans le feuille de style du menu, il y a... www.commentcamarche.net/forum/affich-6036754-conflit-feuilles-de-style-menu-lightbox
Menu horizontale (Résolu) Bonjour a tous, J'aimerais faire un menu horizontale un peu comme cmc en haut de page mais sans qu'il soit déroulant. Cependant je n'y arrive pas j'ai tenter de faire une liste a puce comme pour un menu verticale et changer le code... www.commentcamarche.net/forum/affich-4860335-menu-horizontale
Menu Horizontal multi-niveaux (Résolu) Bonjour, J'aimerai bien avoir le code source CSS ou Javascript qui permet d'obtenir un menu Horizontal multi-niveau et qui ressemble a celui de cette page "Regardez plus haut : Menu Décideur". (Vous pouvez survoler votre souris sur... www.commentcamarche.net/forum/affich-8314453-menu-horizontal-multi-niveaux

Résultats pour menu horizontal déroulant

Ajouter un raccourci dans le menu contextuel du poste de travailQui n'a jamais rêvé de pouvoir avoir accès en un seul clic à certaines commandes enfouies dans les menus déroulants du système ? Problématique Imaginons que nous voulions aller dans la fenêtre de gestion de l'ordinateur. 2... www.commentcamarche.net/faq/sujet-5359-ajouter-un-raccourci-dans-le-menu-contextuel-du-poste-de-travail

Résultats pour menu horizontal déroulant

Menu horizontal (Résolu)Bonjour, je suis en train de creer un site web et je previens quand meme que je debute !! ^^ Bref je suis tombé sur un site qui possede un menu horizontal qui me plait bien ! Ce site le voici, c'est celui de la Nasa ! :p http://www.nasa.gov/... www.commentcamarche.net/forum/affich-7480339-menu-horizontal
Menu horizontal à plusieurs niveaux en CSS?? (Résolu)Bonjour, Pour mon cours d'internet, je dois faire 1 site web sans rien d'autre que de l'HTML et du CSS... J'aimerais donc ajouter un menu horizontal à plusieurs niveaux mais sans javascript et tout ce qui s'en suit...... www.commentcamarche.net/forum/affich-9047030-menu-horizontal-a-plusieurs-niveaux-en-css
Cherche menu horizontal déroulant en haut (Résolu)Bonjour, Je travaille actuellement sur un site, où j'ai besoin d'un menu déroulant horizontal mais qui se déroule vers le haut. Pour l'instant mon menu déroule en bas, et je n'ai pas trouvé de propriété ou de truc pour le faire... www.commentcamarche.net/forum/affich-5552897-cherche-menu-horizontal-deroulant-en-haut