0

这个答案：

当元素被覆盖时取消 mouseout 事件

接近某个地方，但并不是我真正想要的，因为它有点扭转我的问题。

我正在制作一个类似于 Facebook 图片查看器的图片库。

图像被加载到一个绝对定位的位置div，该位置在屏幕上居中，并以 z-index 值浮动在主页上方。

图像的左右是绝对定位的小div元素，z-index比图像高1。这些div元素是单击图库的左右箭头。

图像加载时箭头被隐藏，但是当用户将鼠标移到图像上时，箭头应该淡入，然后如果它们再次移开，它们就会淡出......就像 Facebook 查看器一样。

我正在使用hoverIntent它来实现这一点，并且效果很好。

但是...当用户将他/她的鼠标移动到箭头 div 中时，hoverIntent将其视为mouseleave下方图像上的一个事件并隐藏箭头...

所以......我需要的是能够hoverIntent忽略箭头div。

我使用的代码hoverIntent非常直接：

        function showArrows() {
            $('.imgNav').fadeIn(500);
        };
        function hideArrows() {
            $('.imgNav').fadeOut(500);
        };
        $(img).hoverIntent(showArrows, hideArrows);

显然img是 jQuery 图像对象并且.imgNav是箭头的类名。

编辑：

我在这里创建了一个：http fiddle: //jsfiddle.net/jhartnoll/cE6gu/

4

1 回答 1

0

使用您的小提琴示例，更改

$('.enlarged').hoverIntent(showArrows, hideArrows);

到

$('.imgViewer').hoverIntent(showArrows, hideArrows);

为我做了诀窍http://jsfiddle.net/cE6gu/4/

请注意，在 hoverintent 网站上，它说它旨在忽略子元素（此处），因此您只需要确保在包含所有这些 div 的父元素上调用 hoverintent。

于 2012-12-06T16:35:32.217 回答