проблема с setTimeout - PullRequest
Новая
       6

проблема с setTimeout

0 голосов
/ 12 сентября 2010

Я пытаюсь создать эффект.проблема в длительности эффекта.для моего эффекта я хочу передать параметр длительность.это установит интервал, в котором работает эффект.как jquery делает это на их эффектах?Я пытался с setTimeout, но это довольно сложно.

Спасибо за любую помощь.

Ответы [ 3 ]

2 голосов
/ 12 сентября 2010

Два основных способа создания циклов пользовательского интерфейса в JavaScript в браузерах: setTimeout и setInterval:

setTimeout вызовет функцию через указанный интервал в миллисекундах. Время не обязательно точное, и вы не можете запланировать что-то в течение 10 мс в браузерах. Он возвращает дескриптор, который можно использовать для отмены обратного вызова (если вы доберетесь до него до того, как это произойдет) через clearTimeout. Чтобы сделать цикл, вы устанавливаете новый тайм-аут после завершения обработки предыдущего.

setInterval будет вызывать функцию несколько раз через заданный интервал (также в миллисекундах, также с типичным минимумом 10 мс). Возвращает дескриптор, который можно использовать для остановки повторов с помощью clearInterval. Вам не нужно начинать новый каждый раз, переводчик выполняет циклы за вас.

То, что вы выберете, зависит как от того, что вы пытаетесь сделать, так и от личных предпочтений. Обратите внимание, что интервалы в setInterval отсчитываются от того, когда обратный вызов назывался , тогда как если вы запланируете новый setTimeout в конце обработки обратного вызова, он, очевидно, будет запланирован вместо этого , Если ваша обработка занимает какое-то значительное время, разница может быть важной (но, опять же, то, что вы хотите, полностью зависит от решаемой вами проблемы).

Я думаю о "продолжительности", как о том, сколько времени потребуется для запуска эффекта целого , который будет лежать вне одного из них - это будет функцией вашего кода эффекта. Большинство эффектов, которые я видел, работают поэтапно (не знаю, как еще вы их сделаете) и выясняете, сколько шагов нужно предпринять, исходя из того, какую длительность вы им даете и какой максимальной детализации, по мнению автора, было необходимо. Например, переход от белого к черному может занять 255 шагов, если вы этого хотите, но это может быть слишком медленным (и мы оставим в стороне дискуссии об «смягчении», когда шаги корректируются в зависимости от того, как человеческий глаз и разум их воспринимают ). Вы можете сделать это за 10 шагов с шагом каждые 50 мс, если вам сказали, что это займет полсекунды, но вы можете сделать это за 20 шагов с тем же интервалом, если у вас была полная секунда, чтобы сделать это. И т.д.

1 голос
/ 12 сентября 2010

основное правило 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';

0 голосов
/ 12 сентября 2010

Кажется, они используют setInterval: http://github.com/jquery/jquery/blob/master/src/effects.js#L340

...