Question

我正在使用一个名为tipTip的jquery插件（http://code.drewwilson.com/entry/tiptip-jquery-plugin）。我将其用于电子商务网站，当用户将鼠标悬停在产品图片上时，会显示一个信息框，其中包含有关该产品的额外详细信息。

tipTip的默认行为是，一旦用户将鼠标移离链接，悬停框就会消失。您还可以设置keepAlive：true以要求用户将鼠标移到悬停框上以使框消失。这两种情况都不适合我。我在悬停框中有链接，因此用户需要能够进入框而不会消失。但我也不希望用户被要求进入该框以使其消失。移开链接和方框应该会消失。

为了解决这个问题，我一直试图将一个jquery延迟（）放入tipTip javascript中。我也尝试过使用setTimeout。但是我发现我所能发生的一切就是悬停盒一直存在，直到用户移动到另一个链接上。虽然我希望delay（）意味着它在我指定的毫秒数之后消失，而不管用户是否已移动到另一个链接。

您可以在此处查看完整的tipTip js代码：http://code.google.com/p/geoapps/source/browse/trunk/capstones/talha_khopekar_2012/jquery.tipTip.js?spec=svn108&r=108

我一直试图通过修改最后几行来实现延迟。我尝试添加延迟如下：

 function deactive_tiptip(){
                                    opts.exit.call(this);
                                    if (timeout){ clearTimeout(timeout); }
                                    tiptip_holder.delay(1000).fadeOut(opts.fadeOut);
                            }

但正如我所说，这样做的结果是悬停框保持不变，直到用户移动到另一个链接，并激活一个新的悬停框。我真的不明白为什么会这样。我的理解是延迟函数应该简单地将fadeOut延迟1秒，然后fadeOut应该正常进行。

Answer 1

当我试图延迟另一个函数的调用时，我对这个js函数运气不错。

window.setTimeout(function(){callFunction(params);}, 4000);

如果这有帮助，请告诉我。我有一袋js的技巧。

此致

Answer 2

因此，您真正想要做的是在热点区域中包含工具提示，并且仅在用户同时保留初始项目和工具提示时停用。

查找调用deactivate_tiptip（）函数的'mouseout'事件的位置，并为tooltip类添加'add'函数。我不知道架构，但它可能看起来像这样：

tiptip.mouseOut(function () { deactivate_tiptip(); }; // Original
tiptip.add(".TOOLTIP").mouseOut(function () { deactivate_tiptip(); }; // Ammended

// OR:

tiptip.on("mouseOut", function () { deactivate_tiptip(); }; // Original
tiptip.add(".TOOLTIP").on("mouseOut", function () { deactivate_tiptip(); }; // Ammended

您必须将'.TOOLTIP'更改为正确的班级。只有当你同时离开时才会触发停用功能。

延迟jquery fadeOut

2 个答案: