0

最后我的第一个-希望是-简单的问题。

我正在为我的客户编写一个工具，我计划在向他们提供访问信息时解释如何使用它，但以防万一，我会弹出“工具提示”来帮助他们。

我正在尝试编写一种教程，它将遍历页面上的元素，弹出它们的工具提示，然后在短暂延迟后转到下一个元素（显然首先隐藏元素）

这是我得到的：“#show-help”是我的按钮，“.hashelp”表示该类有一个工具提示，“.help”是实际的工具提示。现在它正在突出显示所有“.hashelp”元素，但没有显示我的工具提示。我正在使用“i”来逐步延迟每个步骤。

$("#showhelp").click(function(){
         var i = 0;
            $(".hashelp").each(function(){
                $(this).find(".help").eq(0).css("top",$(this).offset().top +10);
                $(this).find(".help").eq(0).css("left",$(this).offset().left +10);
                $(this).delay(i*5000).effect("highlight", {color: "yellow"},5000);
                $(this).find(".help").eq(0).delay(i*5000).show().delay((i+1)*5000).hide();
                i++;
         });
    });

任何帮助都会很棒！

4

1 回答 1

1

您的问题在于您使用delay(). 不幸的是，它只适用于 jQuery 的动画效果框架。这在delay()API 文档1中有明确解释：

只有队列中的后续事件被延迟；例如，这不会延迟不使用效果队列的 .show() 或 .hide() 的无参数形式。

所以有一些关于如何处理它的选择。修复代码的最简单（如果可能有点性能要求高）的方法是“动画化”show()并hide()给它们 0 的持续时间：

$(this).find(".help").eq(0).delay(i*5000).show(0).delay((i+1)*5000).hide(0);

但你也应该记住，你的第一次延迟可能不起作用，因为效果队列上可能没有任何东西（这是我的一个薄弱领域，所以试试看）。您可能需要在其中添加额外hide(0)的东西以确保效果队列中有一些东西：

$(this).find(".help").eq(0).hide(0).delay(i*5000).show(0).delay((i+1)*5000).hide(0);

仅当您发现有必要使事情正常进行时才这样做。

或者，您可以使用一系列setTimeout()调用，但这对代码来说会很尴尬，所以只有在看到性能问题时才这样做。

于 2012-09-06T03:31:23.397 回答