jquery - mouseleave 2 个元素显示/隐藏 1 个元素？

Question

我有 2 个元素 <ul>和一个 <div> .

如果我将鼠标悬停在 div 上，我希望 ul 出现，当我鼠标离开 div 时，我想检查鼠标是否在 ul 上，如果没有，我想再次隐藏 ul。

这是我的代码，它可以在 Chrome 和 safari 中运行，但不能在 Firefox 中运行，有人知道可能导致此错误的原因吗？

$('.footer')
    .mouseenter(function() {
        $('ul#date').fadeIn();
    })
    .mouseleave(function(){
        $('ul#date').hover(
            function() {
                $('ul#date').mouseleave(function() {
                    $('.footer').hover(
                        function() {
                            return;
                        },
                        function() {
                            $('ul#date').fadeOut();
                        }
                    );
                });
            },
            function() {
                $('ul#date').fadeOut();
            }
        );
    });

编辑HTML 标记

<div id="main-wrapper">

    <div class="clearfix" id="main">

        <div class="column" id="content">

            <div class="section">

                <h1 id="page-title" class="title">Titletest</h1>

                <div class="region region-content">

                    <div class="block" id="block-system-main">

                        <div class="content">

                            <div typeof="sioc:Item foaf:Document" class="node" id="node-13">

                                <ul id="date" style="display: none;">

                                </ul>

                            </div><!-- /.node -->

                        </div>

                    </div><!-- /.block -->

                </div><!-- /.region -->

            </div>

        </div><!-- /.section, /#content -->

    </div>

</div>

<div class="footer"></div>

解决方案

好的，多亏了crowicked，我达到了我想要的效果，这是感兴趣的人的代码。

$('.footer').hover(
    function()
    { 
        $('ul#date').stop();

        if ($('ul#date:hidden'))
        { 
            $('ul#date').fadeIn();
        }

    }
);

$('ul#date').mouseleave( function(){ $('ul#date').fadeOut(); });

Answer 1

为什么不附上 ul#date里面.footer元素并只需使用 .hover() .footer 上的函数显示/隐藏 <ul> ？

编辑:添加了 drupal 标签。尝试这样的事情:

$('.footer').hover(
   if ($('ul#date').is(':hidden')) {
      function(){
         $('ul#date').fadeIn();
      }
   }
);

$('ul#date').mouseleave( function(){
   $('ul#date').fadeOut();
});