javascript - jQuery滑动菜单错误

Question

我正在使用jQuery（3 级）制作动画菜单。我正在使用效果slideDown和slideUp. 有时（但并非总是如此），当我打开第一个主要项目的子菜单时，第二个主要项目的子菜单在我刷新页面之前将不起作用。它适用于效果fadeIn和fadeOut，但我想使用幻灯片。

这是我的代码：http: //jsfiddle.net/mcCAx/

Answer 1

这为我解决了 这里

$(document).ready(function()
    {    
        $('li.MainStage').hover(        function()
            {
                $(this).stop();
                $(this).find('ul.SubStage').slideDown('slow');
            },        function()
            {
                $(this).stop();
                $(this).find('ul.SubStage').slideUp('slow');
            });

        $('li.SubStage').hover(        function()
            {
                $(this).stop();
                $(this).find('ul.Sub2Stage').slideDown('slow');
            },        function()
            {
                $(this).stop();
                $(this).find('ul.Sub2Stage').slideUp('slow');
            });        
    });

Answer 2

问题是<ul class="SubStage">元素的样式被覆盖了。因此，通过在回调中重新覆盖样式来以防万一。您的侧边菜单每次都会出现。:)

$(document).ready(function()
{    

    $('li.MainStage').hover(
    function()
        {
            $(this).find('ul.SubStage').slideDown('slow',function(){
                $(this).parent().find('ul.SubStage').css({overflow:"visible"});
            });
        },
    function()
        {
            $(this).find('ul.SubStage').stop().slideUp('slow');
        });

    $('li.SubStage').hover(
    function()
        {
            $(this).find('ul.Sub2Stage').slideDown('slow');
        },
    function()
        {
            $(this).find('ul.Sub2Stage').stop().slideUp('slow');
        });        
});​

在这里查看。