Sujet Précédent Sujet Suivant

Pb affichage de sous-menu

Résolu
cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007 - 26 janv. 2007 à 11:45
cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007 - 27 janv. 2007 à 12:25
Bonjour à toutes et à tous,

Je viens à vous pour un souci d'affichage. Lorsque ma souris passe sur le menu principal, des sous-menus doivent apparaître. Lorsque je visualise dans les navigateurs FF et IE, il n'y a rien du tout, seulement le menu principal. Si quelqu'un peut m'aider à résoudre ce problème, j'en serais heureux.

Voici le contenu du HTML en question (avec le CSS après).




<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="css_v3/emx_nav_right.css" type="text/css" />
<script type="text/javascript">
<!--
var time = 3000;
var numofitems = 7;

//menu constructor
function menu(allitems,thisitem,startstate){
  callname= "gl"+thisitem;
  divname="subglobal"+thisitem; 
    this.numberofmenuitems = allitems;
    this.caller = document.getElementById(callname);
    this.thediv = document.getElementById(divname);
    this.thediv.style.visibility = startstate;
}
                 
//menu methods
function ehandler(event,theobj){
  for (var i=1; i<= theobj.numberofmenuitems; i++){
      var shutdiv =eval( "menuitem"+i+".thediv");
    shutdiv.style.visibility="hidden";
    }
    theobj.thediv.style.visibility="visible";
}
               
function closesubnav(event){
  if ((event.clientY <48)||(event.clientY > 107)){
    for (var i=1; i<= numofitems; i++){
      var shutdiv =eval('menuitem'+i+'.thediv');
            shutdiv.style.visibility='hidden';
        } 
    }
}
// -->
</script>
</head>

skip to: page content | links on this page | site navigation | footer (site information)

  Site Name

 

   
[# global link][# global link][# global link][# global link][# global link][# global link][# global link]

    <!--end globalLinks-->
 

  <!-- end globalNav -->
 
[# subglobal1 link] | [# subglobal1 link] | [# subglobal1 link] | [# subglobal1 link] | [# subglobal1 link] | [# subglobal1 link] | [# subglobal1 link]

 
[# subglobal2 link] | [# subglobal2 link] | [# subglobal2 link] | [# subglobal2 link] | [# subglobal2 link] | [# subglobal2 link] | [# subglobal2 link]

 
[# subglobal3 link] | [# subglobal3 link] | [# subglobal3 link] | [# subglobal3 link] | [# subglobal3 link] | [# subglobal3 link] | [# subglobal3 link]

 
[# subglobal4 link] | [# subglobal4 link] | [# subglobal4 link] | [# subglobal4 link] | [# subglobal4 link] | [# subglobal4 link] | [# subglobal4 link]

 
[# subglobal5 link] | [# subglobal5 link] | [# subglobal5 link] | [# subglobal5 link] | [# subglobal5 link] | [# subglobal5 link] | [# subglobal5 link]

 
[# subglobal6 link] | [# subglobal6 link] | [# subglobal6 link] | [# subglobal6 link] | [# subglobal6 link] | [# subglobal6 link] | [# subglobal6 link]

 
[# subglobal7 link] | [# subglobal7 link] | [# subglobal7 link] | [# subglobal7 link] | [# subglobal7 link] | [# subglobal7 link] | [# subglobal7 link]

 
[# subglobal8 link] | [# subglobal8 link] | [# subglobal8 link] | [# subglobal8 link] | [# subglobal8 link] | [# subglobal8 link] | [# subglobal8 link]

<!-- end masthead --><!--end pagecell1-->

<script type="text/javascript">
    <!--
      var menuitem1 = new menu(7,1,"hidden");
            var menuitem2 = new menu(7,2,"hidden");
            var menuitem3 = new menu(7,3,"hidden");
            var menuitem4 = new menu(7,4,"hidden");
            var menuitem5 = new menu(7,5,"hidden");
            var menuitem6 = new menu(7,6,"hidden");
            var menuitem7 = new menu(7,7,"hidden");
    // -->
    </script>

</html>




et voici le CSS :




body{
    font-family: Arial,sans-serif;
    color: #333333;
    line-height: 1.166;
    margin: 0px;
    padding: 0px;
    background: #cccccc url(bg_grad.jpg) fixed;
}

a:link, a:visited{
    color: #005FA9;
    text-decoration: none;
}

a:hover{
    text-decoration: underline;
}

h1{
    font: bold 200% Arial,sans-serif;
    color: #334d55;
    margin: 0px;
    padding: 0px;
}

#masthead{
    position: absolute;
    top: 2px;
    left: 2%;
    right: 2%;
    width:95.6%;
    height: 197px;
   
#siteName{
    margin: 0px;
    padding: 16px 0px 8px 0px;
    color: #ffffff;
    font-weight: normal;
}

#globalNav{
    position: absolute;
    width: 100%;
    min-width: 640px;
    height: 32px;
    color: #cccccc;
    padding: 0px;
    margin: 0px;
    background-image: url(glbnav_background.gif);
    top: 140px;
    left: 1px;
}

#globalNav img{
    margin-bottom: -4px;
}

#gnl {
    position: absolute;
    top: 0px;
    left:0px;
}

#gnr {
    position: absolute;
    top: 0px;
    right:0px;
}

#globalLink{
    position: absolute;
    top: 6px;
    height: 22px;
    min-width: 640px;
    padding: 0px;
    margin: 0px;
    left: 10px;
    z-index: 100;
}

a.glink, a.glink:visited{
    font-size: small;
    color: #000000;
    font-weight: bold;
    margin: 0px;
    padding: 2px 5px 4px 5px;
    border-right: 1px solid #8FB8BC;
}

a.glink:hover{
    background-image: url(glblnav_selected.gif);
    text-decoration: none;}

.skipLinks {display: none;}

/************ subglobalNav styles **************/

.subglobalNav{
    position: absolute;
    top: 174px;
    left: 2px;
/*width: 100%;*/
    min-width: 640px;
    height: 20px;
    padding: 0px 0px 0px 10px;
    visibility: hidden;
    color: #ffffff;
}

.subglobalNav a:link, .subglobalNav a:visited {
    font-size: 80%;
    color: #ffffff;
}

.subglobalNav a:hover{
    color: #cccccc;
}





Merci de bien vouloir me donner un coup de main......

2 réponses

Réponse 1 / 2
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
26 janv. 2007 à 13:57
B
onjour...

tout d'abord il manque...
#masthead{
    position: absolute;
    top: 2px;
    left: 2%;
    right: 2%;
    width:95.6%;
    height: 197px;
}    <-- ICI
dans la déclaration des styles, peut être copier coller hasardeux

ensuite dans...
function closesubnav(event){
  if ((event.clientY <48)||(event.clientY > 107)){
    for (var i=1; i<= numofitems; i++){
      var shutdiv =eval('menuitem'+i+'.thediv');
            shutdiv.style.visibility='hidden';
        } 
    }
}
 il est surement necéssaire d'ajuster les valeurs en rouge

;0)
3
Réponse 2 / 2
cs_phelsuma Messages postés 11 Date d'inscription jeudi 7 septembre 2006 Statut Membre Dernière intervention 7 novembre 2007
27 janv. 2007 à 12:25
Merci beaucoup PetoleTeam pour ta réponse. J'ai appliqué tes conseils et ça marche très bien. Je débute tout juste dans le web, heureusement que vous êtes là pour les astuces !

Il fallait effectivement changer les valeurs notées en rouge. Bien vu !

A+
0

Discussions similaires

menu en c
sebz10 -
decricri62 -

4 réponses
comment créer un sous menu
msi79 -
msi79 -

8 réponses
affichage de caractere dans une grille
anzelus -
anzelus -

2 réponses
créer un menu principal
cs_valsta -
valsta -

5 réponses
Menu et sous menu
tennisman59 -
maili20 -

11 réponses
Rejoignez-nous