hello,
Après avoir, vainement, cherché dans les sujets déjà existants, je poste ici, en espérant que les visiteurs du dimanche (ceux de la semaine sont aussi les bienvenus) pourront m'aider.
Je "travaille" actuellement sur la mise en page d'un site perso et je bloque sur un probleme lié au menu dynamique.
Il y a une barre de navigation, tout ce qu'il y a de plus banale et au survol d'un élément, un sous-menu s'affiche grâce à du javascript (display:block)
Le code HTML
Et le CSS
Le probleme, enfin, les problemes sont les suivants :
- au survol de la barre de navigation, quand le sous-menu s'affiche, il pousse le reste de la page, au lieu de s'afficher "par dessus".
- et il est impossible de cliquer sur les liens du sous-menu qui "débordent" (qui empietent sur le "contenu")
mieux que des mots, l'exemple en action : http://aterla.e-supinfo.net
merci d'avance
Modifié par yoh (31 Jul 2005 - 19:28)
Après avoir, vainement, cherché dans les sujets déjà existants, je poste ici, en espérant que les visiteurs du dimanche (ceux de la semaine sont aussi les bienvenus) pourront m'aider.
Je "travaille" actuellement sur la mise en page d'un site perso et je bloque sur un probleme lié au menu dynamique.
Il y a une barre de navigation, tout ce qu'il y a de plus banale et au survol d'un élément, un sous-menu s'affiche grâce à du javascript (display:block)
Le code HTML
<div id="conteneur">
<div id="nav">
<ul id="menu">
<li><a href="#" onmouseover="montre();">section 1</a></li>
<li><a href="#" onmouseover="montre('sousMenu1');">section 2</a>
<ul id="sousMenu1" class="sousMenu">
<li><a href="#">élément du sous menu</a></li>
<li><a href="#">élément du sous menu</a></li>
</ul>
</li>
</ul>
</div>
<div id="colonne">
<p>petit blabla, menu etc...</p>
</div>
<div id="contenu">
<h2>un titre</h2>
<p>le gros blablabla</p>
</div>
</div>
Et le CSS
#menu {
margin: 0;
padding: 0;
width: 550px;
}
#menu li {
float: left;
}
#menu a {
display: block;
margin: 0 4px;
padding 1px 0 1px 0;
width: 100px;
}
.sousMenu {
display: none;
margin: 0;
padding: 0;
}
.sousMenu li {
float: none;
}
.sousMenu a {
margin: 1px 5px 1px 5px;
padding 1px 0 1px 0;
width: 99px;
}
#colonne {
float: right;
position: relative;
width: 150px;
}
#contenu {
margin-right: 150px;
position: relative;
}
Le probleme, enfin, les problemes sont les suivants :
- au survol de la barre de navigation, quand le sous-menu s'affiche, il pousse le reste de la page, au lieu de s'afficher "par dessus".
- et il est impossible de cliquer sur les liens du sous-menu qui "débordent" (qui empietent sur le "contenu")
mieux que des mots, l'exemple en action : http://aterla.e-supinfo.net
merci d'avance
Modifié par yoh (31 Jul 2005 - 19:28)