当鼠标悬停在页面加载框上时，从运行停止 jQuery

Question

我有这个jQuery:

jQuery('.slidey').on('hover',function(){
    if (jQuery(window).width() > 1151) {
    jQuery(this).children('.post-content').stop().slideToggle(180);
}});

但是，我遇到了一个问题，如果我加载页面，并且我的鼠标已经在滑动框的位置，那么框将向上滑动并且切换将被反转......所以 -当我悬停时我想显示的切换状态在我不悬停时显示，当我悬停时它隐藏，而不是相反......！

如果在页面加载时鼠标已经位于鼠标上方，我如何让 jQuery 忽略鼠标以阻止此切换被反转？我浏览了这里的其他问题，但解决方案似乎不起作用。

希望能帮到你。

Answer 1

鉴于 .hover here 的规范，我建议同时使用 hoverIn 和 hoverOut，然后不要使用 slideToggle，而是使用 slideDown 和 slideUp 例如：

jQuery('.slidey').hover( 
  function(){
    if (jQuery(window).width() > 1151) {
      jQuery(this).children('.post-content').stop().slideDown(180);
    }
  },
  function(){
    if (jQuery(window).width() > 1151) {
      jQuery(this).children('.post-content').stop().slideUp(180);
    }
  }
);

此外，在此处找到 See Additional Notes:

Deprecated in jQuery 1.8, removed in 1.9: The name "hover" used as a shorthand for the string "mouseenter mouseleave". It attaches a single event handler for those two events, and the handler must examine event.type to determine whether the event is mouseenter or mouseleave. Do not confuse the "hover" pseudo-event-name with the .hover() method, which accepts one or two functions.

当鼠标悬停在页面加载框上时，从运行停止 jQuery

Stop jQuery from running when mouse is hovering over box on page load

javascript

mouse

jquery

当鼠标悬停在页面加载框上时，从 运行 停止 jQuery

Stop jQuery from running when mouse is hovering over box on page load

javascript

mouse

jquery

当鼠标悬停在页面加载框上时，从运行停止 jQuery