-2

我试图创造一种效果。问题是效果的持续时间。为了我的效果，我想传递一个参数持续时间。这将设置效果运行的时间间隔。jquery 是如何影响它们的效果的？我尝试使用 setTimeout 但这很复杂。

谢谢你的帮助。

4

3 回答 3

2

在浏览器上使用 JavaScript 进行 UI 循环的两种基本方法是setTimeout和setInterval：

setTimeout将在指定的时间间隔（以毫秒为单位）后调用一个函数。时间不一定准确，通常不能在浏览器上安排 10 毫秒内的时间。它返回一个句柄，你可以使用它来取消回调（如果你在它发生之前得到它）clearTimeout。要进行循环，您在处理完前一个超时后设置一个新的超时。

setInterval将以给定的时间间隔重复调用一个函数（也以毫秒为单位，典型的最小值也为 10 毫秒）。它返回一个句柄，您可以使用它来停止重复clearInterval。您不必每次都开始一个新的，解释器会为您执行循环。

你选择哪一个取决于你想要做什么和个人喜好。请注意，时间间隔是从调用setInterval回调时开始计算的，而如果您在回调处理结束时安排一个新的时间间隔，那么显然会从该点开始安排。如果您的处理需要花费大量时间，则差异可能很重要（但同样，您想要的完全取决于您要解决的问题）。setTimeout

我认为“持续时间”是效果作为一个整体运行所需的时间，这将位于其中任何一个之外——它将是您的效果代码的一个函数。我见过的大多数效果都是按步骤运行的（不知道你会怎么做），并根据你给它们的持续时间和作者认为需要的最大粒度来计算要采取多少步骤。例如，如果您愿意，从白色渐变到黑色可能需要 255 步，但这可能太慢了（我们将搁置“缓动”的讨论，即根据人眼和思维对它们的感知方式调整步长）。如果你被告知要花半秒的时间，你可能会分 10 步，每 50 毫秒一个步骤，但如果你有一整秒的时间，你可能会以相同的时间间隔分 20 步来做。

于 2010-09-12T12:39:35.860 回答
1

基本规则 position = Initial_value + (change_in_time * start_time) / duration

function animate(duration){
  var startTime = new Date().getTime();
  var tmr = setInterval(function() {
      var elapsedTime = new Date().getTime() - startTime;
      if (elapsedTime < duration) {
        var f = elapsedTime / duration;
         // Here " f " is in an important parameter in our animation
      }else {
        clearInterval(tmr);
      }
  }, 1);
}

试用演示：http: //jsbin.com/eruko4

注意：在我的示例（演示）中，我正在考虑Inital value as '0';

于 2010-09-12T12:46:36.920 回答
0

他们似乎正在使用 setInterval：http: //github.com/jquery/jquery/blob/master/src/effects.js#L340

于 2010-09-12T12:41:34.513 回答