更好的jquery悬停编码

我有一个链接

（“#login_display”）

，它在单击时从子菜单“（“.box_login”）上滑下。我想要的是，当有人将鼠标移出链接或子菜单时，子菜单会向上滑动

这段代码正在运行，但是有更好的方法吗？因为当鼠标离开子菜单（'.box_login'）进入链接（'#login_display'）时，会有一点滞后，因为链接会打开子菜单（'.box_login'），鼠标会将其关闭

谢谢

以下是脚本：

$('#login_display').hover(function() {
    $('.box_login').slideDown('normal');
}, function() {});

$('.box_login').hover(function() {}, function() {
    $('.box_login').slideUp('normal');
});

---

您可以通过使用

mouseenter

和

mouseout

事件来简化。同时缓存

$（'.box\u login'）

。然后使用

$（此）

而不是重复

$（'.box\u login'）

，最后删除

'normal'

，因为这是默认速度。你的表现会有一点提高，但我不认为除了这一点，你还能做什么。发布html可能有助于提高性能

var $boxLogin = $('.box_login'); // Cache for speed

$('#login_display').mouseenter(function(){ 
    $boxLogin.slideDown();
});

$boxLogin.mouseout(function(){ 
   $(this).slideUp();
});

---

您可以通过使用

mouseenter

和

mouseout

事件来简化。同时缓存

$（'.box\u login'）

。然后使用

$（此）

而不是重复

$（'.box\u login'）

，最后删除

'normal'

，因为这是默认速度。你的表现会有一点提高，但我不认为除了这一点，你还能做什么。发布html可能有助于提高性能

var $boxLogin = $('.box_login'); // Cache for speed

$('#login_display').mouseenter(function(){ 
    $boxLogin.slideDown();
});

$boxLogin.mouseout(function(){ 
   $(this).slideUp();
});

---

我会把你的链接和滑下div放在一个容器中。然后使用容器的mouseleave事件向上滑动

---

我会把你的链接和滑下div放在一个容器中。然后使用容器的mouseleave事件向上滑动

---

看看你的网站，这是最适合你的。试试这个

$('#login_display').hover(function() {
    clearTimeout($(this).data('mouseovertimer'));
    clearTimeout($('.box_login').data('mouseovertimer'));
    $('.box_login').slideDown('normal');
}, function() {
    var $this = $(this);
    $this.data('mouseovertimer', setTimeout(function(){
         $('.box_login').slideUp('normal');
    }, 100));
});

$('.box_login').hover(function() {
    clearTimeout($('#login_display').data('mouseovertimer'));
}, function(){
    var $this = $(this);
    $this.data('mouseovertimer', setTimeout(function(){
         $this.slideUp('normal');
    }, 100));
});

---

看看你的网站，这是最适合你的。试试这个

$('#login_display').hover(function() {
    clearTimeout($(this).data('mouseovertimer'));
    clearTimeout($('.box_login').data('mouseovertimer'));
    $('.box_login').slideDown('normal');
}, function() {
    var $this = $(this);
    $this.data('mouseovertimer', setTimeout(function(){
         $('.box_login').slideUp('normal');
    }, 100));
});

$('.box_login').hover(function() {
    clearTimeout($('#login_display').data('mouseovertimer'));
}, function(){
    var $this = $(this);
    $this.data('mouseovertimer', setTimeout(function(){
         $this.slideUp('normal');
    }, 100));
});

---

---

您能显示标记吗？这将有助于更好地回答您的问题。您可以发布您的HTML以获得它的全貌吗？您的代码不会隐藏

登录框

，如果您刚从

登录显示

，您的工作情况如何？网站是：www.entendu.info链接是“connexion”，您可以显示标记吗？这将有助于更好地回答您的问题。您可以发布您的HTML以了解其全貌吗？您的代码将不会隐藏

登录框

，如果您刚离开

登录显示

，您的工作情况如何？网站是：www.entendu.info链接是“connexion”问题是div不能在一起第一个div在我的菜单栏上，另一个在我的工具条网站上是：www.entendu.info链接是“connexion”，如果元素不相邻。。。在这个世界上，你怎么能把显示器放在向下滑动的菜单上，而不触发离开链接的事件呢<代码>我想要的是，当有人将鼠标从链接或子菜单中移出时，子菜单会向上滑动啊，我明白了。谢谢你的链接。您需要考虑一下。尝试一下，在这两个元素中添加一个类

login

。然后检查事件对象的

toElement

属性，确保您正在退出页面上的其他位置。问题是div不能在一起第一个div在我的菜单栏上，另一个在我的工具条网站上是：www.entendu.info链接是“connexion”，如果元素不相邻。。。在这个世界上，你怎么能把显示器放在向下滑动的菜单上，而不触发离开链接的事件呢<代码>我想要的是，当有人将鼠标从链接或子菜单中移出时，子菜单会向上滑动啊，我明白了。谢谢你的链接。您需要考虑一下。尝试一下，在这两个元素中添加一个类

login

。然后检查事件对象的

toElement

属性，确保您正在退出页面上的其他位置。该死，这正是我要找的！如果有一天你有5分钟的时间向我解释一下它是如何工作的，我会很乐意学习。解决方法很简单。我有一个超时鼠标的链接以及框。在这段时间内，如果您将鼠标悬停在其中任何一个上，只需清除超时，使框不会向上滑动。也添加了演示。看一看。该死的，这正是我要找的！如果有一天你有5分钟的时间向我解释一下它是如何工作的，我会很乐意学习。解决方法很简单。我有一个超时鼠标的链接以及框。在这段时间内，如果您将鼠标悬停在其中任何一个上，只需清除超时，使框不会向上滑动。添加了演示也看看。