0

嘿，我在测试页面上有这个（请原谅一些奇怪的设计元素，客户选择不会摇摆不定）

http://blueanchorcreative.com/

下拉导航不会像我期望的那样显示隐藏的无序列表项。我添加了 z-index: 1 认为幻灯片可能隐藏了它，但这也不起作用。

jQuery：

$(function(){

    var config = {    
         sensitivity: 3,     
         interval: 200,     
         over: doOpen,       
         timeout: 200,      
         out: doClose      
    };
    
    function doOpen() {
        $(this).addClass("hover");
        $('ul:first',this).css('visibility', 'visible');
    }
 
    function doClose() {
        $(this).removeClass("hover");
        $('ul:first',this).css('visibility', 'hidden');
    }
    
    $("ul.dropdown li ul li:has(ul)").find("a:first").append(" » ");

});
4

1 回答 1

1

您的菜单中有一些无效的 HTML。你有ul's 直接包含ul's (子菜单)，在这个ul子菜单中应该是父菜单的一部分li。

通过从网站获取您的 html，请参阅下面的更正 HTML 和示例演示Fiddle 。

    <ul class="dropdown">
    <li><a href="#">Home</a>
    </li>
    <li><a href="#">Domestic Plumbing</a> <!-- Issue here li was closed -->

        <ul class="sub_menu">
            <li><a href="#">Hot Water</a>
            </li>
            <li><a href="#">Drainage</a>
            </li>
            <li><a href="#">Toilets</a>
            </li>
            <li><a href="#">Taps</a>
            </li>
            <li><a href="#">Other</a>
            </li>
        </ul>
    </li>
    <li><a href="#">Rural Plumbing</a><!-- Issue here li was closed -->

        <ul class="sub_menu"> 
            <li><a href="#">Septic Systems</a>
            </li>
            <li><a href="#">Effluent Systems</a>
            </li>
            <li><a href="#">Blocked Drains</a>
            </li>
            <li><a href="#">Absorption Trenches</a>
            </li>
            <li><a href="#">Other</a>
            </li>
        </ul>
    </li>
    <li><a href="#">Commercial/Industrial Plumbing</a>
    </li>
    <li><a href="#">Bushfire Protection</a><!-- Issue here li was closed -->

        <ul class="sub_menu">
            <li><a href="#">External Sprinkler Systems</a>
            </li>
            <li><a href="#">Window Drenchers</a>
            </li>
            <li><a href="#">Tanks/Pumps/Accessories</a>
            </li>
            <li><a href="#">Testing &amp; Maintenance</a>
            </li>
        </ul>
    </li>
</ul>
于 2013-05-06T03:59:12.820 回答