Jquery：到达顶部前向下滑动停止

因此，我使用jquery在悬停时向下滑动

hr

标记。这方面的一个例子是在airware网站上（当您将鼠标悬停在菜单项上时）

我的问题是，我试图使

hr

标记在到达上面的菜单项之前消失

例如：

<nav>
 <ul>
  <li>Link<hr/></li>
 </ul>
</nav>

js

当hr标签向上滑动时，我希望它在某个点停止并返回显示：无。我想这样做，使hr标记不会接近它上面的文本。

---

如果这个问题不完全有意义，请随意提问

您可以在稍短的时间内使用淡出，然后将幻灯片动画退出队列，以便两者同时发生

hr{ display:none }
li{ display:inline }

var $nav = $('nav li');
$nav.hover(function(){
    if($(this).find('hr').is(":hidden")){
        $(this).find('hr').slideDown(400);
    }
},function(){
    if($(this).find('hr').is(":visible")){
        $(this).find('hr').slideUp(400);
    }

});  

$(document).ready(function () {
    var $nav = $('nav li');
    $nav.hover(function () {
        if ($(this).find('hr').is(":hidden")) {
            $(this).find('hr').slideDown(400);
        }
    }, function () {
        if ($(this).find('hr').is(":visible")) {
            $(this).find('hr').slideUp({queue:false, duration:400});
            $( this ).find('hr').fadeOut(300);
        }

    });
});