0

ドロップダウン メニューは、IE を除くすべてのブラウザで正常に動作しています。開発者ツールでホバー機能がトリガーされているのを確認できますが、何らかの理由でメニューが実際には表示されません。考えられるあらゆる方法で CSS を微調整しました...見落としているものはありますか?

サイトはhttp://www.ironbridgeband.comです。

音楽は自動的に再生されます (私の選択ではありません)。サウンド レベルには注意してください 。開発者ツールによると、IE9 はブラウザー モードです。

編集:使用されているCSSとJQueryは次のとおりです。

    /* 
    LEVEL ONE
*/
#navigation > ul                         {text-align: center; position: relative;}
#navigation > ul li{
float: left;
background: transparent;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00990000,endColorstr=#00990000); 
zoom: 1;
z-index: 0;
}
#navigation > ul a:hover                 {color: #000;}
#navigation > ul a:active                {color: #fff;}
#navigation > ul li a                    {display: block;}
#navigation > ul li.hover,
#navigation > ul li:hover                {color: #fff; position: relative; }
#navigation > ul li.hover a              {color: #FFF;}


/* 
    LEVEL TWO
*/
ul.children{
    list-style-type: none;
    font-size: 0.8em;
    width: 100%;
    visibility: hidden;
    position: absolute;
    top: 50px;
    z-index: 500;
    margin-left: 0px !important;
    padding-left: 0px !important;
    line-height:2em;
    background: transparent !important;
    }

ul.children li{
    font-size: 16px;
    text-transform: none;
    font-weight: normal;
    float: none !important;
    clear: both;
    font-weight: bold; 
    background: #158082;
    color: #fff; 
    border: none; 
    float: none; 
    margin-left: -25px !important;
    padding: 0 !important;
    z-index: 501;
    }

ul.children li.hover{
    background-color: transparent !important;
    }                                     
                                    /* IE 6 & 7 Needs Inline Block */
ul.children li a{ 
    border-right: none; 
    display: inline-block;
    width:auto;
    } 

* JQuery: *

$(function(){

    var config = {    
         sensitivity: 1, // number = sensitivity threshold (must be 1 or higher)    
         interval: 100,  // number = milliseconds for onMouseOver polling interval    
         over: doOpen,   // function = onMouseOver callback (REQUIRED)    
         timeout: 200,   // number = milliseconds delay before onMouseOut    
         out: doClose    // function = onMouseOut callback (REQUIRED)    
    };

    function doOpen() {
        console.log("doOpen()")
        $(this).addClass("hover");
        $('ul:first',this).css('visibility', 'visible');
        $('ul:first',this).css('z-index', '100001');
    }

    function doClose() {
        console.log("doClose()")
        $(this).removeClass("hover");
        $('ul:first',this).css('visibility', 'hidden');
    }

    $("#navigation > ul li").hoverIntent(config);

    $("#navigation > ul li ul li:has(ul)").find("a:first").append(" » ");

});
4

1 に答える 1

0

#navigation 要素に、ドロップダウン メニューよりも高い z-index を指定してみてください。

于 2012-07-30T21:53:12.787 に答える