SOS - menu CSS

cs_kristale Messages postés 6 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 18 avril 2007 - 22 mars 2007 à 18:36
cs_polipoli Messages postés 1 Date d'inscription jeudi 14 juillet 2005 Statut Membre Dernière intervention 19 juin 2010 - 19 juin 2010 à 19:21
Je suis complétement coincée!!!!!!
J'ai fait un petit menu css et javascript, mais le relover de mon "menu1", "menu 2", menu 3" ne fontionne pas. J'aimerai qu'ils soient souligné et aparaissent en une autre couleur.

Mais pour les sous menus (sous menu 1.1, etc) le relover (souligné) se fait correctement! Pourtant le code est le même et je ne comprends pas ou est l'erreur....?!!!

SVP AIDEZ-MOI!!!!!

Voici le code:

<html>
<head>


<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% 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;
}
#menu
{
    width: 11.5em;
}
#menu dt
{
    cursor: pointer;
    margin: 0;
    text-indent: 0.3cm;
    vertical-align: baseline;
    font-weight: ;
    border-bottom: solid 1px #666666;
    background: #F2F2F2;
    color: #686868;
    font-size: #small;
    font: 85% arial, sans-serif;
}
#menu dd

    border-bottom: 1px solid #666666;   

#menu dt a {
 
    height: 20px;
    line-height: 20px;    
 display: block;
    width:100%;  } 
#menu dt a:hover
{
    background: #F9F9F9;
    text-decoration: underline;
 
}   
#menu li
{
    text-align: center;
    background: #F9F9F9
}   
#menu li a
{
    color:#686868;
    text-decoration: none;
    display: block;
    border: 0 none;
    height: 100%;
    font-size: #small;
    font: 85% arial, sans-serif;

#menu li a:hover
{
    background: #F9F9F9;
    text-decoration: underline;
}


-->
</style>




<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Document sans nom</title>
</head>




   * Menu 1

    :

    
     <li>Sous-Menu 1.1</li>
     <li>Sous-Menu 1.2</li>

     <li>Sous-Menu 1.3</li>
    
    
   
  
  
  
   
   * Menu 2

    :

    
     <li>Sous-Menu 2.1</li>
     <li>Sous-Menu 2.2</li>

     <li>Sous-Menu 2.3</li>
    
    

   * Menu 3

    :

    
     <li>Sous-Menu 3.1</li>
     <li>Sous-Menu 3.1</li>

     <li>Sous-Menu 3.1</li>
     <li>Sous-Menu 3.1</li>
     <li>Sous-Menu 3.1</li>

     <li>Sous-Menu 3.1</li>
    
   

  
 


 


 



</html>

7 réponses

Flachy Joe Messages postés 2103 Date d'inscription jeudi 16 septembre 2004 Statut Membre Dernière intervention 21 novembre 2023 1
22 mars 2007 à 20:45
J'ai pas vraiement regardé le code mais t'as testé sous IE ou Firefox ou quoi ?
Si t'as juste testé IE, la solution est peut-etre là :
http://www.xs4all.nl/~peterned/csshover.html

C'est un fichier htc pour prendre en charge le hover sur toutes les balises et non seulement pour les "a"

Flachy Joe
0
cs_kristale Messages postés 6 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 18 avril 2007
22 mars 2007 à 21:22
Merci bcp....!

Mais je comprends pas super bien l'anglais

j'au essayé d'enregistré mon fichier avec l'extension .htc mais ça ne donne toujours rien. Le problème doit venir de mon code css.

C'est cette partie du code qui ne doit pas fonctionner:
#menu dt a:hover
{
    background: #F9F9F9;
    text-decoration: underline;
 
}   

qu'en penses-tu........PLEASE?
0
Flachy Joe Messages postés 2103 Date d'inscription jeudi 16 septembre 2004 Statut Membre Dernière intervention 21 novembre 2023 1
23 mars 2007 à 18:47
T'es sous IE ?????
Sinon la suite ne te servira à rien.
1) Télécharger le fichier "csshover.htc" : http://www.xs4all.nl/%7Epeterned/htc/csshover.htc
2) Le mettre dans la même répertoire que le fichier css
3) Ajouter la ligne
body { behavior:url("csshover.htc"); }
au fichier css.

Flachy Joe
0
cs_kristale Messages postés 6 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 18 avril 2007
26 mars 2007 à 16:47
Oui je suis sur IE, mais rien ne change.

Je pense plutot que c'est un problème lié à mon code.

Si quelqu'un a une autre idée, n'hésitez pas à m'aider, merci!!!
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
26 mars 2007 à 18:50
B
onjour...

dans ta déclaration de style

#menu dt a { 
    height: 20px;
    line-height: 20px;    
 display: block;
    width:100%;

#menu dt a:hover {
    background: #F9F9F9;
    text-decoration: underline;
}
   
c'est le a qui récupére le hover hors il n'y a pas de balise a dans tes dt...
essaies
<dt>[javascript:void(0); Menu 1]</dt>

;0)
0
cs_kristale Messages postés 6 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 18 avril 2007
27 mars 2007 à 19:46
Merccccciiii!!!! ça fonctionne!!!

Mais il y a encore un petit détail: j'aimerai qu'une fois que l'on clique sur le Menu 1, Menu 2, que ca reste en gras (lorsque l'on va dans les sous menus aussi)... Je dois changer l'événement javascript onclick, je pense? Que mettre à la place?

Si tu peux me donner encore un coup de pouce ça serait vraiment cool...
0
cs_polipoli Messages postés 1 Date d'inscription jeudi 14 juillet 2005 Statut Membre Dernière intervention 19 juin 2010
19 juin 2010 à 19:21
comment ajouter un sous sous menu dans ce code merci
0
Rejoignez-nous