Forum CMS Made Simple FR
Bug Hover sur menu IE7 - Version imprimable

+- Forum CMS Made Simple FR (http://www.cmsmadesimple.fr/forum)
+-- Forum : Général (http://www.cmsmadesimple.fr/forum/forumdisplay.php?fid=3)
+--- Forum : Graphisme (http://www.cmsmadesimple.fr/forum/forumdisplay.php?fid=9)
+--- Sujet : Bug Hover sur menu IE7 (/showthread.php?tid=411)



Bug Hover sur menu IE7 - xX WeI Xx - 20/05/2010

Citation :#~~~~~ NE PAS SUPPRIMER CE BLOC ~~~~~
#~ Version du CMS: 1.7.0
#~ Nom de l'hébergeur :
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.7
#~ Installed Modules:
#~ * Play: 1.0.3
#~ * NFS: 1.0
#~ * Printing: 1.0.4
#~ * News: 2.10.4
#~ * nuSOAP: 1.0.1
#~ * ModuleManager: 1.3.3
#~ * CGExtensions: 1.18.7
#~ * Album: 0.9.3
#~ * JQueryTools: 1.0.6
#~ * Calendar: 0.8.2
#~ * Captcha: 0.4
#~ * CMSMailer: 1.73.14
#~ * FileManager: 1.0.2
#~ * FrontEndUsers: 1.9
#~ * FormBuilder: 0.6.2
#~ * CustomContent: 1.5.3
#~ * MenuManager: 1.6.2
#~ * Search: 1.6.2
#~ * SiteMapMadeSimple: 1.2.1
#~ * Statistics: 1.0.1
#~ * ThemeManager: 1.1.1
#~ * TinyMCE: 2.7.0
#~ * CGSimpleSmarty: 1.4.4
#~ * CGGoogleMaps: 1.4.1
#~ * AjaxMadeSimple: 0.1.6
#~ * jQuery: 0.0.5
#~ Config Information:
#~ * php_memory_limit:
#~ * process_whole_template: false
#~ * max_upload_size: 16000000
#~ * default_upload_permission: 664
#~ * assume_mod_rewrite: true
#~ * page_extension: .htm
#~ * internal_pretty_urls: false
#~ * use_hierarchy: true
#~ Php Information:
#~ * phpversion: 5.2.13
#~ * md5_function: On (Vrai)
#~ * gd_version: 2
#~ * tempnam_function: On (Vrai)
#~ * magic_quotes_runtime: Off (Faux)
#~ * E_STRICT: 0
#~ * memory_limit: 128M
#~ * max_execution_time: 30
#~ * safe_mode: Off (Faux)
#~ * session_save_path: /tmp (1777)
#~ * session_use_cookies: On (Vrai)
#~ Server Information:
#~ * Server Api: cgi
#~ * Server Db Type: MySQL (mysql)
#~ * Server Db Version: 5.0.90
#~ ----------------------------------------------
#~~~~~ NE PAS SUPPRIMER CE BLOC ~~~~~
Bonjour,

J'ai quelques soucis avec mon menu qui me fait des misères sous IE7 et sur aucun autre navigateur (y compris IE6, même si le ie6nomore est de mise Wink ). J'ai un menu principal, horizontal, qui lors d'un hover fait apparaitre un sous-menu, horizontal lui aussi.
Deux soucis :
-Il y a un décalage assez important du sous-menu par rapport à son parent que je n'arrive pas à corriger.
-Lorsque je survole une section du menu est survolé, le sous-menu apparait et reste "visible" lorsque je passe la souris sur lui (bloc ul). Sur IE7, le sous-menu ne reste visible que lorsque je suis sur ses liens : si je sors du texte avec la souris et que je me retrouve dans le bloc, le sous-menu disparait.

Voici le code-source de toute la partie menu :
Code :
/* A CSS Framework by Mike Stenhouse of Content with Style, adapted to CMSMS by Daniel Westergren */

/* NAV */

    * html div#menu_horiz {
        /* hide ie/mac \*/
        height: 1%;
        /* end hide */
    }
    div#menu_horiz {
        width: 100%;  
          height: 20px;
        text-transform:uppercase;
    }

    div#menu_horiz li {
        display: inline;
    }



    div#menu_horiz li a {
        border-right: none;
    }

    div#menu_horiz .activeparent {
        display: inline-block;
        /* hide from ie/mac \*/
        display: block;
        /* end hide */
    }


/* END NAV */
/* this contains nothing but when the submenu drops it falls over it*/
/* making it LOOK like it contains the nav items*/
#submenu_horiz {
    /*background-color: #790451;*/
    
    height: 30px;
}

ul#nav {
        display: inline-block;
        width:100%;
        margin-left:20px;
        padding: 5px;
        /* hide from ie/mac \*/
        display: block;
        /* end hide */
        font-size: 1em;
        line-height: 1em;
        text-decoration: none;
    
        text-transform: uppercase;
        color:#009cce;
        font-weight: bold;
        cursor:default;
}

ul#nav li {
    float: left;
  
    padding:5px;
}

ul#nav li a {
    text-decoration: none;
        border-right: none;
        line-height: 1em;
}

ul#nav li:hover,
li:active {
color:#9c9c9c;
}

ul#nav a:hover,
a:active {
color:#9c9c9c;
}



/* note the a declarations below don't use #menu_horiz in front */
/* if you do they won't work */

/* this one formats the actual 'nested' unordered list */
li ul {
       /*background:  url(uploads/Horizontal_dropdown/nav_hover_bg.jpg) repeat 0 0px;     */
        position: absolute;
    
        padding:10px;
        left: -999%;
        width:100%;
    height: 20px;
        text-align:left;
        color: #9c9c9c;
    }

/* IE7 fix
* html li ul {
        margin-left: -100px;
        margin-top: 40px;
} AUCUN EFFET SUR IE*/

/* and these format the list items within it */
li li {
/*background:  url(uploads/Horizontal_dropdown/nav_bg.jpg) repeat 0 0px;*/

}

/* this stuff makes it drop - you need a javascript file for it work with IE6 though*/

li:hover ul, li.over ul {
        left:auto;
}

li li:hover, li li.over { display: inline; color: #9c9c9c; border: none;margin:0;padding:0;}
Le plus primordial reste le bug du hover, les décalages, je pense que je vais pouvoir y arriver.
Le js applique la classe "over" aux éléments fils.