jQuery.fadeIn（）未按预期工作

我有下面显示子菜单的代码。我希望鼠标悬停时子菜单淡入，但它不会淡入-它只是立即显示子菜单：

jQuery("ul li").mouseover(function() {
    jQuery(this).fadeIn(1000, function () {
        jQuery(this).find('ul').css('right','0px').css('top','24px');
    });
}).mouseout(function(){
    jQuery(this).find('ul').css('right','-1000px');
});

---

谢谢

首先，问题是，没有任何东西会褪色，因为您正在尝试褪色您所在的

，而不是它下面的

，并且它已经可见。然后，您在淡入淡出回调中移动它，这意味着淡入淡出完成后它会在屏幕上移动（而且淡出无论如何都不会发生）

对于修复：这里有一些东西，首先您可能需要和这里（在输入/离开子元素时不会触发）。您可以通过使用来进一步缩短它，但因为您只是定位和隐藏/显示，所以只需执行隐藏/显示，而无需重新定位。另外，请确保您正在淡入您所在位置下方的

，而不是您所在位置的

。以下是整体外观：

jQuery("ul li ul").hide().css({ right: 0, top: 24 });
jQuery("ul li").hover(function() {
    jQuery(this).find('ul').fadeIn(1000); //possibly .children('ul') instead
}, function(){
    jQuery(this).find('ul').hide();
});

这将使用的对象重载将其缩短一点。但是，您可以从CSS中的以下内容开始：

ul li ul { right: 0; top: 24; display: none; }

---

然后您可以删除第一行：

jQuery（“ul-li-ul”）.hide（）.css（{right:0，top:24}）
为什么要将鼠标置于css右上方？顺便说一句，您会在li元素中淡入，而不是在子菜单中//淡入ul