Question

我多次使用jQuery和hoverIntent插件，对于下拉菜单和高级导航应该更优雅一些。但我遇到了一个问题。

我有一个带有可点击li元素的菜单，它也有一个悬停。 如果有人在意图定时器触发之前点击它我想取消hoverintent ，只是因为它看起来更好。

我无法弄清楚如何，设计师第一，编码器第二。这就是所谓的意图：

$('#navigationContainer ul li').hoverIntent(configDown);

它有一个定义灵敏度等的变量configDown。两个函数叫做slideUp和slideDown。一切都很完美。

如果有人点击了同一个元素，我想取消hoverIntent。任何帮助将不胜感激。

Answer 1

不是取消hoverIntent，而是修改hoverIntent回调中的代码，首先检查是否点击了li：

var configDown = {
    slideUp: function () {
        if ($(this).hasClass('no-intent')) return;
        // slide up
    },
    slideDown: function () {
        if ($(this).hasClass('no-intent')) return;
        // slide down
    }
};

$('#navigationContainer ul li').click(function () {
    $(this).addClass('no-intent');
}).hoverIntent(configDown);

除非你对hoverIntent有一个很好的延迟，否则正确触发它可能会很棘手（你可能会在触发hoverIntent之后最终点击），但基本的想法是你可以调整。

取消hoverIntent计时器

1 个答案: