Voila j'ai réalisé un menu en css avec un poil de javascript pour dynamiser un peu (oui il n'est pas encore entierement css !)
Et j'ai un souci avec explorer et/ou firefox.
Lors de l'ouverture de mes sous menu (cf code plus bas) explorer aggrandit la div qui contient mes sous menu alors que j'ai fixer la taille de celle ci a 0 (classe .sous_menu).
J'arriv a regler ce probleme en rajoutant overflow:hidden a la classe .sous_menu, mais la c'est firefox qui ne m'affiche plus les sous menu.
J'avoue ne pas voir comment faire pour que ca fonctionne sur les deux plates forme.
Help
Ben
CODE
<style type="text/css">
<!--
#menu{
border-top: 1px #CCCCCC;
border-right: 1px #CCCCCC;
border-bottom: 1px solid #CCCCCC;
border-left: 1px #CCCCCC;
padding-top: 1px;
padding-bottom: 1px;
background: #5A6BA5;
}
.sous_menu {
height:0px;
}
#menu p{
padding-left: 5px;
font-family: Geneva, Arial, Helvetica, sans-serif;
margin-top: 2px;
margin-bottom: 2px;
}
#menu p a{
vertical-align: middle;
color: #FFFFFF;
font-family: Geneva, Arial, Helvetica, sans-serif;
text-decoration: none;
}
#menu p a:hover{
text-decoration: underline;
}
#menu2 {
border-top: 1px #CCCCCC;
border-right: 1px #CCCCCC;
border-bottom: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
padding-top: 1px;
padding-bottom: 1px;
background:#339999;
position: relative;
top: -21px;
right: -160px;
}
-->
</style>
<div id='menu'>
<p><a href='#' onmouseover='sous_menu(16)'>Auteur</a></p>
<div id='ss16' class='sous_menu'>
<div id='menu2'>
<p><a href='index.php?m=1000' target='_self'>Me Déconnecter</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=1' target='_self'>Votre Profil</a></p>
</div>
</div>
</div>
<div id='menu'>
<p><a href='#' onmouseover='sous_menu(17)'>Cours</a></p>
<div id='ss17' class='sous_menu'>
<div id='menu2'>
<p><a href='index.php?m=100' target='_self'>Liste des Branches</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=104' target='_self'>Arborescence</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=400' target='_self'>Liste des Packs</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=10' target='_self'>Mes Modules</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=105' target='_self'>Recherche</a></p>
</div>
</div>
</div>
<div id='menu'>
<p><a href='#' onmouseover='sous_menu(20)'>Télécom</a></p>
<div id='ss20' class='sous_menu'>
<div id='menu2'>
<p><a href='#' onclick="popup_menu('../phpBB2/index.php');">Forum</a></p>
</div>
<div id='menu2'>
<p><a href='index.php?m=601' target='_self'>Messagerie</a></p>
</div>
</div>
</div>
<script type="text/javascript">
var tab_b = Array(16,17,20);
function sous_menu(id){
var truc = '';
for(var i=0; i< tab_b.length; i++){
var truc = 'ss'+tab_b[i];
document.getElementById(truc).style.display = 'none';
}
document.getElementById('ss'+id).style.display = 'block';
}
sous_menu();
</script>
[Modérateur : merci d'utiliser la balise CODEBOX]