如何给鼠标悬停时间延迟

发布于 2024-10-02 19:36:16 字数 489 浏览 4 评论 0原文

我有以下代码

$(document).ready(function(){

    //When mouse rolls over
    $("#nav #nav_li").mouseover(function(){
        $(this).stop().animate({height:'140px', width:'182px'},{queue:false, duration:600})
    });

    //When mouse is removed
    $("#nav #nav_li").mouseout(function(){
        $(this).stop().animate({height:'11px', width:'146px'},{queue:false, duration:900})
    });


});

,当我将鼠标

悬停在 #nav_li 上时,它会突然动画工作,几秒钟后它就会动画

谢谢大家

I have a following code

$(document).ready(function(){

    //When mouse rolls over
    $("#nav #nav_li").mouseover(function(){
        $(this).stop().animate({height:'140px', width:'182px'},{queue:false, duration:600})
    });

    //When mouse is removed
    $("#nav #nav_li").mouseout(function(){
        $(this).stop().animate({height:'11px', width:'146px'},{queue:false, duration:900})
    });


});

In that when i do mouse over its suddenly animate works

when i hover the #nav_li it will animate after few seconds

Thank you folks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

千纸鹤 2024-10-09 19:36:16

AFAIK,有 jQuery 插件 HoverIntent 来处理这个问题。

overIntent 是一个尝试
确定用户的意图...就像
水晶球,只能用鼠标
移动!它的工作原理就像(并且是
源自)jQuery 的内置悬停。
然而,不是立即
调用onMouseOver函数,它
等待直到用户的鼠标速度减慢
在拨打电话之前就已经足够冷静了。

为什么?为了延缓或阻止
意外触发动画或
阿贾克斯调用。简单的超时适用于
小区域,但如果您的目标区域
很大,它可能会执行,无论
意图。

AFAIK, there is jQuery plugin HoverIntent to deal with that issue.

overIntent is a plug-in that attempts
to determine the user's intent... like
a crystal ball, only with mouse
movement! It works like (and was
derived from) jQuery's built-in hover.
However, instead of immediately
calling the onMouseOver function, it
waits until the user's mouse slows
down enough before making the call.

Why? To delay or prevent the
accidental firing of animations or
ajax calls. Simple timeouts work for
small areas, but if your target area
is large it may execute regardless of
intent.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文