jquery - jquery 只删除/添加一次类

Question

我的jQuery代码：

$(document).ready(function() {  
    $("#adminbar").mouseover(function () {  
        $(this).addClass("adm_bar").slideDown("slow");  
    });
    $("#adminbar").mouseout(function () {  
        $(this).removeClass("adm_bar").slideUp("slow");  
    });  
});  

但是，当您使用#adminbar 将 div 悬停时，它只会添加/删除一次该类，如果您再次尝试这样做，它将无法正常工作。我希望您能够根据需要将其悬停多次。
怎么了？

编辑：它在页面顶部，我的网站（正在建设中）

Answer 1

看起来当您使用 slideUp 时，jQuery 会自动将显示设置为无，因此您不能悬停不“存在”的元素 - 它仍然存在但不能“悬停”。

在 slideUp 之后尝试添加一个 display : "block" 属性和 visibility: "hidden"。

您应该能够以这种方式悬停元素。

Answer 2

您可以尝试使用 jQuery .hover()：

$("#adminbar").hover(function() {
  $(this).addClass("adm_bar").slideDown("slow", function() {
    $(this).css({
        visibility : 'visible',
        display: 'block'
    })
  });  
},
function() {
  $(this).removeClass("adm_bar").slideUp("slow", function() {
    $(this).css({
        visibility : 'hidden',
        display: 'block'
    })
  }); 

您需要visibility: hidden/visible在动画完成后。因为在动画隐藏后它使用它display: none作为结果它无法捕获下一个悬停事件。所以你的代码也可以工作。

Answer 3

使用该.hover()功能。

$("#adminbar").hover(function() {
    $(this).addClass("adm_bar").slideDown("slow");  
},
function() {
    $(this).removeClass("adm_bar").slideUp("slow");  
});