Question

我目前正在处理的网站位于： http://counterbeing.com

我试图解决的问题是，当您在“类别”按钮上运行鼠标时，子菜单项会弹出，但在您点击它们之前就会消失。

我尝试过各种各样的事情。首先，我试图将子菜单项包含的div定义为也会触发动画的div，但这似乎不起作用......

这是我用来抓取两个图层的javascript文件。我将它分为2层，因为其中一层有些透明。

$(document).ready(function() {
($("div#CategoriesLink")||$("div#CategoryButtonHolder")).hover(function(){
    $("div#navdrop").animate({
        top: "0px"
    })
    $("div#CategoryButtonHolder").animate({
        top: "0px"
    })
}); 
$("div#CategoriesLink").mouseout(function(){        

    $("div#navdrop").animate({
        top: "-162px"
    })
    $("div#CategoryButtonHolder").animate({
        top: "-162px"
    })
});
});

Answer 1

所以，首先，如果你在CategoryButtonHolder上使用rgba背景，你不需要使用两个div。

接下来，您将使用mouseout事件处理程序为div备份动画。因此，每次鼠标离开按钮时，都会激活鼠标。尝试将mouseout处理程序移动到CategoryButtonHolder。

$("#CategoryButtonHolder").mouseout(function(){
   $(this).animate({
       top: '-'+$(this).outerHeight()
   });
)};

Answer 2

对于悬停，一个解决了这类问题的好插件是hoverintent插件：http://cherne.net/brian/resources/jquery.hoverIntent.html;你可以让它等待并保持X毫秒的时间，然后它非常顺利。

HTH。

如何使我的下拉保持下降？

2 个答案: