javascript - 只要光标在工具提示文本上，如何让 jQuery Beauty Tip 保持打开状态？

Question

我正在使用 jQuery beauty tips (它也在使用 hoverIntent plugin )并且我想在工具提示文本中显示一个 href 链接并允许用户点击该链接。

但是，一旦我们离开 anchor ，toottip 文本就会在超时(我们可以定义)后消失

因此，只要用户光标位于 anchor 或工具提示文本上，我就希望工具提示文本保持打开状态。

我该怎么做？这可能吗？我尝试过，但没有成功，例如:

$('.bt').bt({
postShow: function(box) {
  $(".bt-content").hoverIntent({
    timeout : 500,
    over: function() {
      $(".bt-wrapper").show(); //or $(".bt-active").btOn();
    }
  });
}
})

Answer 1

这是可能的。以下解决方案使用 jQuery 1.7 和 hoverIntent r5。我在 Chrome、Safari、FF 3.7、FF 7 和 IE8 中对其进行了测试。

$('.bt').bt({
    postShow: function(box) {
        $(box).hoverIntent({
            over: function() {
                    $(this).data('hasmouse', true);
            },
            out: function() {
                    $(this).data('hasmouse', false);
                    $(box).hide();
            },
            timeout: 300,
        });
    },
    hideTip: function(box, callback) {
        if ($(box).data('hasmouse')) {
            return;
        }
        $(box).hide();
        callback(); 
    },
});

我再次使用 hoverIntent，这次是在 BeautyTip 框上，以设置一个标志(“data-hasmouse”)，指示鼠标是否仍在工具提示上悬停。只要设置了标志，新的 hideTip 方法就不会执行任何操作。相反，BeautyTip 框会在其自身的“hoverIntent out”触发时隐藏。