当通过鼠标滚轮滚动将光标移开时,jquery悬停保持悬停

标签 jquery hover mouseover

我不确定这是否是 jquery 函数的限制或我的代码中的错误,但我可以在 http://api.jquery.com/hover/ 的示例中看到相同的行为发生。

我的实现是,我有一个弹出框,当鼠标悬停在产品项目上时显示,当鼠标悬停时隐藏。

问题是当鼠标悬停并显示弹出框时,如果我使用鼠标滚轮/触控板向下/向上滚动页面,而由于滚动而鼠标光标不再位于产品项目上,则悬停-out 行为未被检测到,并且弹出框仍然在视野中,保留在屏幕中间,因为它的位置是在悬停事件期间确定的,相对于产品在屏幕上的位置。

这有道理吗?有人可以帮忙吗?

最佳答案

这是一个有点侵入性的解决方案,但它应该有效:

// The normal hover handler
$("#productElement").hover(function(){
  $("#otherElement").show();
},function(){
  $("#otherElement").hide();
});

// A global scroll handler that hides an specific
// element whenever the user scrolls.
$(document).scroll(function(){
  $("#otherElement").hide();
});

在上面的代码中,#productElement 将是用户将鼠标悬停到的标签,#otherElement 将是悬停时弹出的对话框。这只是它如何工作的基础知识;您将使其适应您的代码。

关于当通过鼠标滚轮滚动将光标移开时,jquery悬停保持悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7845845/

相关文章:

javascript - jQuery validate bootstrap 插件不验证多个表单

jQuery .mousemove() 与 :hover

CSS 导航菜单——悬停状态为父 UL 高度的 100%

CSS类不工作

鼠标悬停和鼠标按下时的 jQuery 图像交换

css - 在 Chrome 中按下鼠标按钮时悬停样式无法应用

javascript - jQuery UI 可拖动中的错误

javascript - 播放 Vimeo 视频时暂停 Bootstrap 轮播

php - 检索一个 php 值并在 javascript 中使用它

当鼠标已经位于 onLoad 元素上方时,带有 .toggle() 的 jQuery MouseEnter 和 MouseOut 事件会反转?