Jquery:如何向 mouseleave 添加延迟,以便如果有人无意间将鼠标悬停在元素上,它仍然保持打开状态

2024-02-05

悬停意图插件与我需要的相反。 我有一个由 .trigger 触发的 .popup,当我将鼠标悬停在其上时,我希望 .popup 在几秒钟内不淡出,但如果我将鼠标悬停,然后再次悬停,则取消将要发生的淡出并保持 .popup 打开。

有谁知道我会怎么做?

这不起作用,但这是一个想法:

 $('.trigger').hover(function(){
        $('.popup').fadeIn(600)
    }, function() {
        $('.popup').delay(2000, function(){
            if ($(this).blur() = true) {
                $('.popup').fadeOut(600)
            }
        });
    })

jQuery悬停意图插件 http://cherne.net/brian/resources/jquery.hoverIntent.html正是您所寻找的。

超时属性将设置在调用 out 函数之前鼠标需要离开该区域的时间。

引用悬停意图网站:

暂停: 在调用“out”函数之前的简单延迟(以毫秒为单位)。如果用户在超时到期之前将鼠标移回到元素上,则不会调用“out”函数(也不会调用“over”函数)。这主要是为了防止草率/人为的鼠标轨迹暂时(无意地)使用户离开目标元素......给他们时间返回。默认超时:0

要设置它...

$('.trigger').hoverIntent({
     over: startHover,
     out: endHover,
     timeout: 2000
});

然后定义要处理的函数over and out

 function startHover(e){
    //your logic here
    $('.popup').fadeIn(600)
 }

 function endHover(){
     //your logic here
     $('.popup').fadeOut(600)
 }

EDIT:

您还可以调整interval属性来增加/减少 startHover 函数触发的时间...默认设置为 100 毫秒...您可以将其设置为零,以便在鼠标进入触发区域时立即触发弹出窗口(如果您愿意)喜欢。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Jquery:如何向 mouseleave 添加延迟,以便如果有人无意间将鼠标悬停在元素上,它仍然保持打开状态 的相关文章

  • jQuery.data() 存储在哪里?

    jQuery 将值存储在哪里data 它设置为 DOM 对象 是否有某种变量 例如jQuery dataDb或者什么 甚至可能是私人的东西 有什么办法可以访问这个对象吗 在内部 jQuery 创建一个名为的空对象 cache 用于存储您通过
  • 根据分辨率更改字体大小

    我正在开发一个网页 它的不同段落 h 等使用不同的尺寸 我在用着em sizes 字体大小 2em 举个例子 但是 当我将屏幕分辨率更改为较低的分辨率时 我希望该尺寸也较小 为此 我尝试了以下代码
  • Jquery 检查输入 .val() 是否包含某些字符

    我需要检查页面上的输入字段是否包含字符 这是用于非常基本的电子邮件地址验证 因此我只想检查文本是否不为空 并且包含 and 人物 我一直在尝试这样的方式 if parentname attr class email val contains
  • asp.net/jQuery:使用 jQuery 将数据发布到弹出窗口 [IE]

    我正在尝试在 asp net 应用程序中使用 jQuery 将数据发布到弹出窗口 如果弹出窗口打开 我会收到三个错误 第一个错误是 Errror the value of the property is null or undefined
  • 如何从 javascript 有效地访问 gzipped xml?

    我需要从 javascript 实际上是从 Greasemonkey 有效地访问一个大的 gzipped xml 文件 不幸的是 服务器不提供 Content Encoding 标头 并且 Content Type 是 applicatio
  • 如何使用 javascript 确定字符串是否只包含空格?

    如何使用 javascript 确定输入字符串是否仅包含空格 另一个好帖子 更快的 JavaScript 修剪 http blog stevenlevithan com archives faster trim javascript 您只需
  • 使用 jquery 连续选取框文本

    我有列表项 并且列表项需要使用 jQuery 进行排序 How 检查这个 http wordcrowd org index php title Rotating marquee with jQuery Cycle http wordcrow
  • 单击按钮时,如何将数字存储在 html 表单输入中作为 javascript 变量? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 基本上我想做的是 当用户在 HTML 表单输入字段中输入一个数字 然后按下提交按钮时 该数字将存储在 JavaScript 变量中
  • 使用Rails UJS,如何从函数提交远程表单

    我正在使用Rails UJS 我有一个表单设置来进行远程提交 如下所示
  • HTTP 状态 415 - JQUERY 中的 AJAX 调用不支持的媒体类型到使用 JERSEY 实现的 Restful WS

    您好 我正在尝试将 json 数据发布到使用 Jersey 实现的 Restful WS 我通过 jquery ajax 发布数据 为什么我会收到 HTTP Status 415 unsupported Media type 谢谢 单击此处
  • 在 setTimeout 中传递 $(this)

    如何将 this 作为 setTimeout 函数 方法 中的参数传递 这是我到目前为止正在做的事情 它正在发挥作用 var Variables Variables ResizeTimer false Variables obj null
  • 获取点击元素的 HTML 内容 jQuery

    我有以下 HTML
  • 匹配数组中的对象并合并

    UPDATE 我有一个名为的对象数组cars包含 li 标签 其中包含有关汽车的属性数据 例如价格 汽车类型等 我的目标是 如果这些汽车符合某些标准 则将它们合并到一个列表中 要求 快速性能 保持相同的汽车数组结构 Main Goal Ma
  • JavaScript 中的正则表达式用于验证十进制数字

    我想要 JavaScript 中的正则表达式来验证十进制数字 它最多只允许两位小数 例如 它应该允许10 89但不是10 899 它还应该只允许一个句点 例如 它应该允许10 89但不是10 8 9 尝试使用以下表达式 d d 0 2 如果
  • 防止jsTree节点选择

    我正在使用 jsTree 插件列出文件系统中的文件夹 我需要防止用户在满足特定条件之前更改到另一个节点 下面的代码不会停止传播 我看到了一些使用其他插件的解决方案 但这是一个简单的任务 没有其他插件它一定是可能的 jstree on sel
  • JQUERY 中用于加载 JQGRID 的选项卡

    我正在使用 jqgrid 制作网格 我想在我的应用程序中创建选项卡 单击选项卡应打开一个网格 选项卡的名称应显示在页面顶部 当我单击另一个选项卡时 它应该加载另一个网格 网格应该加载在同一页面上 并且选项卡也应该始终出现在页面上 我已经创建
  • javascript中输入类型时间的值

    我有这个html
  • 如何在每个组件完成加载后在 Angular 2 中运行 jquery 函数

    我已经尝试了所有生命周期挂钩 但无法实现所需的结果 我需要的结果是触发一个函数 该函数在加载每个元素 组件 后初始化用于单个页面上不同元素的许多 jquery 插件 假设你有这个结构 主页 滑块 小部件 产品旋转器 ETC 这些元素中的每一
  • Javascript 中的线性回归 [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我想在网络浏览器中用 Javascript 进行最小二乘拟合 目前 用户使用 HTML 文本输入输入数
  • 限制 jQuery id 字符串吗?

    简而言之 我的问题是字符串在 jQuery 中作为可搜索 id 或可搜索内容有什么限制 更新 我得到了 ID 部分 但不是为什么我什至无法使用该字符串搜索 html 内容 对于任何愿意告诉我一个正则表达式来将模式从 MM dd yy HH

随机推荐

  • System.nanoTime() 的精度与准确度

    的文档System nanoTime http docs oracle com javase 6 docs api java lang System html nanoTime 说以下 强调我的 此方法只能用于测量经过的时间 与系统或挂钟时
  • 当第二个键已按下时如何检测按键按下/按下

    在我的应用程序中 我允许用户通过按住右箭头键通过使用ProcessCmdKey 现在我想让用户能够在需要时提高滚动速度 理想情况下 用户应该能够按住右箭头键 那么当他决定提高速度时 他应该在不释放右箭头键 同时按住换档键当他决定恢复正常速度
  • 检查两个字符串是否包含相同的字符,不考虑它们的频率

    我有两个字典对应于两个不同字符串的字符数 我想检查它们是否由相同的字符组成 与字符出现的频率无关 说 我有两个字符串caars and racs它们是由相同的角色组成的a c r s 我知道cmp比较两个字典的方法 它还比较两个键值对 但我
  • InputStreamReader缓冲问题

    不幸的是 我正在从一个具有两种字符编码类型的文件中读取数据 有一个标题和一个正文 标头始终采用 ASCII 格式 并定义正文编码所用的字符集 标头不是固定长度 必须通过解析器运行以确定其内容 长度 该文件也可能非常大 因此我需要避免将整个内
  • Ubuntu 11.10 上的 OpenCV

    我刚刚将系统从 ubuntu 11 04 更新到 11 10 现在我无法再编译任何包含 OpenCV 库引用的 C 程序 我已经尝试重新安装 OpenCV 我使用2 1版本 但我遇到了这个错误 tmp ccArHTZL o In funct
  • 如何按百分比设置 svg 宽度和 svg 高度?

    我用 svg 创建了一条线 但是当我调整浏览器大小时 用 svg 创建的线没有调整大小 我尝试以百分比设置 svg 的宽度 但这样做后该线不会出现 如何按百分比设置 svg 的宽度
  • Stream.dropWhile() 没有以两个不同的值返回正确的值

    我正在尝试学习 Java 9 中的新功能 我开始了解 Stream 的 dropWhile 方法 但它在两种不同的场景中返回不同的值 这是我的代码 package src module import java util stream Col
  • 从模态窗口打开的帮助文件没有响应

    使用Delphi XE2 Win64 因此 我有一个包含许多表单的大型应用程序 如果我从主表单打开帮助文件并打开模式窗口 然后按 F1 在模式窗口上触发上下文相关帮助 帮助文件窗口将显示正确的信息 但是在关闭模式窗口之前 无法关闭帮助文件
  • Devise + Omniauth 登录 Facebook 时调用操作通道

    当我尝试使用 Omniauth 和 Devise 登录 Facebook 时 passthru被称为而不是facebook 我如何通过link to user omniauth authorize path facebook 我多次修改代码
  • Web Worker 与 Promise

    为了使 Web 应用程序具有响应能力 您可以使用异步非阻塞请求 我可以设想两种方法来实现这一目标 一种是使用 deferreds promise 另一个是网络工作者 对于 Web Workers 我们最终引入了另一个流程 并且产生了来回整理
  • PHP 错误日志已停止工作。它确实起作用了

    它已经工作了很长时间并且停止了 我一定错过了一些明显的东西 File etc php5 apache2 php ini相关设置有 display errors On I am not sure if this makes a differe
  • NSUndoManager:重做不起作用

    我正在制作一个使用 NSSlider 的简单应用程序 可以使用两个按钮将其设置为最大值或最小值 撤消管理器应跟踪所有更改并允许撤消 重做使用这两个按钮所做的所有更改 这是界面 import
  • 生成一个范围内的随机偶数?

    这是我遵循的格式 int randomNum rand nextInt max min 1 min 这是我的代码 我正在尝试获取 1 到 100 之间的随机偶数 Random rand new Random int randomNum ra
  • 如果我想使用 gitignore 中的文件怎么办

    对于敏感数据 例如 aws 密钥或密码 我将它们放入 gitignore 中的文件中 以确保它不会提交到 git 但是 当脚本运行时要使用按键时 我该怎么办 运行前手动添加文件中的关键内容 如果程序需要由Jenkins定期触发怎么办 谁能帮
  • Django:操作错误没有这样的表

    我正在使用 Django CMS 的 Django 项目中构建一个相当简单的应用程序 Research 这是我对项目 应用程序的第一次尝试 它的主要目的是存储各种知识资产 即研究人员撰写的文章 书籍等 问题是当我将浏览器指向 researc
  • Visual Studio 监视中的向量“无运算符“[]”与这些操作数匹配”错误

    在 Visual Studio 2012 中单步执行以下示例代码时 std vector
  • 如何在 OpenGL 中对 glutSolidTorus 进行纹理处理? [关闭]

    Closed 这个问题需要调试细节 help minimal reproducible example 目前不接受答案 我正在尝试纹理glutSolidTorus 这是我的代码 glColor3f 1 0f 1 0f 1 0f glEnab
  • UIButton 垂直对齐不起作用

    我不明白为什么在下面的代码中 标题对齐没有保持在顶部 UIButton btn2 UIButton buttonWithType UIButtonTypeRoundedRect btn2 titleLabel font UIFont sys
  • 编辑主键

    如果表只包含主键字段 是否可以在 MVC3 中编辑主键 例如 我有一个控制台表 其中我将控制台名称作为主键 我希望能够编辑它并更改它并保存编辑后的值 如果您需要更多信息 请告诉我 作为一般规则 您永远不应该编辑主键 SQL Server 中
  • Jquery:如何向 mouseleave 添加延迟,以便如果有人无意间将鼠标悬停在元素上,它仍然保持打开状态

    悬停意图插件与我需要的相反 我有一个由 trigger 触发的 popup 当我将鼠标悬停在其上时 我希望 popup 在几秒钟内不淡出 但如果我将鼠标悬停 然后再次悬停 则取消将要发生的淡出并保持 popup 打开 有谁知道我会怎么做 这