jQuery fadeOut（）仅当鼠标离开显示的元素时

Question

以下是代码：

var HoverMenuOptions = {
    show: function() {
        $("#UserHoverMenu").css({"display": "block"});
    },

    hide: function() {
        $("#UserHoverMenu").delay(2000).fadeOut(function() {
            $(this).css({"display": "none"});
        });
    }
};

如果鼠标离开链接触发show（）或#UserHoverMenu，我希望div #UserHoverMenu为fadeOut。

我尝试过：

   $('#UserProfileName a').click(function() {

        HoverMenuOptions.show();

    });

   $('#UserProfileName a, #UserHoverMenu').mouseleave(function() {

    HoverMenuOptions.hide();

   });

但是如果鼠标离开#UserProfileName a然后再进入另一个名为#UserHoverMenu的div中，仍会触发隐藏...当我用光标输入#UserHoverMenu时，如何打破触发的fadeOut（）？

Answer 1

$('#UserHoverMenu').mouseenter(function(e){
  $(this).stop(true,true).css({"display": "block"});
});