problème avec setTimeout

Question

J'essaie de créer un effet. le problème est la durée de l'effet. pour mon effet je veux passer une durée de paramètre. ceci définira l'intervalle dans lequel l'effet s'exécute. comment jquery fait-il cela sur leurs effets? J'ai essayé avec setTimeout mais c'est assez compliqué.

Merci pour toute aide.

Answer 1

Les deux façons fondamentales pour faire des boucles de l'interface utilisateur en JavaScript sur les navigateurs sont setTimeout et setInterval:

setTimeout appellera une fonction après un intervalle spécifié en millisecondes. Le timing n'est pas forcément précis, et vous ne pouvez généralement pas programmer quelque chose en moins de 10ms sur les navigateurs. Il renvoie un handle que vous pouvez utiliser pour annuler le rappel (si vous y arrivez avant qu'il ne se produise) via clearTimeout. Pour faire une boucle, vous définissez un nouveau délai lorsque vous avez terminé le traitement précédent.

setInterval appelera une fonction à plusieurs reprises à l'intervalle donné (également en millisecondes, également avec un minimum de 10ms typique). Il renvoie un handle que vous pouvez utiliser pour arrêter les répétitions via clearInterval. Vous n'avez pas besoin d'en commencer une nouvelle à chaque fois, l'interprète fait la boucle pour vous.

Le choix dépend de ce que vous essayez de faire et de vos préférences personnelles. Notez que les intervalles dans setInterval sont comptés à partir du moment où le rappel était appelé, alors que si vous planifiez un nouveau setTimeout à la fin de votre processus de rappel, il sera évidemment planifié à partir de ce point. Si votre traitement prend un temps significatif, la différence peut être importante (mais encore une fois, ce que vous voulez dépend entièrement du problème que vous résolvez).

Je pense à la "durée" comme la durée de l'effet d'un entier pour exécuter, qui serait en dehors de l'un de ces - il serait une fonction de votre code d'effet. La plupart des effets que j'ai vus se déroulent par étapes (je ne sais pas comment vous pourriez les faire) et vous devez déterminer le nombre de mesures à prendre en fonction de la durée et de la granularité maximale que l'auteur estimait nécessaire. Par exemple, passer du blanc au noir peut prendre 255 pas si vous le voulez, mais cela risque d'être trop lent (et nous laisserons de côté les discussions de "détente" où les pas sont ajustés selon la perception de l'oeil et de l'esprit humains). Vous pouvez le faire en 10 étapes avec un pas toutes les 50ms si on vous dit de prendre un total d'une demi-seconde, mais vous pouvez le faire en 20 étapes au même intervalle si vous avez eu une seconde complète pour le faire. Etc.

Answer 2

Ils semblent être en utilisant setInterval: http://github.com/jquery/jquery/blob/master/src/effects.js#L340

Answer 3

la règle de base 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); 
} 

Essayez la démo : http://jsbin.com/eruko4

Remarque: Dans mon exemple (Démo) J'envisage Inital value as '0';