Question

Lorsque vous avez une accélération pour une animation, l'animation suit l'équation de cette accélération.Ce script décrit très bien ce que je veux dire.

Supposons que j'ai choisi un assouplissement, un assouplissement quelconque et un temps d'animation par exemple 1000 ms.L'animation suivra complètement l'équation d'accélération.Si je divise le temps à 500 ms, la période d'animation se divisera mais elle remplira la même équation d'accélération.

Ce que je veux faire, ce n'est pas seulement de diviser le temps, mais aussi l'équation de détente.C'est l'animation terminée, mais elle ne suit pas l'équation complète mais seulement la moitié.

C'est un peu compliqué, je sais, je me demande s'il y a une solution.

Était-ce utile?

La solution

Je voudrais jeter un œil à la fonction Step ( http://api.jquery.com/animate/ ). Selon la collection / l'objet que vous animez, cela peut être une solution à votre problème. Un autre bon article à lire est http://www.bennadel.com/blog/1856-Using-jQuery-s-Animate-Step-Callback-Function-To-Create-Custom-Animations.htm . J'espère que cela aide:

Fonction Step La deuxième version de .animate () fournit une option d'étape - a fonction de rappel qui est déclenchée sur chaque étape de l'animation. Ce La fonction est utile pour activer la personnalisation types d'animation ou modification de l'animation telle qu'elle se produit. Il accepte deux arguments (now et fx), et ceci est défini sur l'élément DOM être animé.

• now: la valeur numérique du propriété en cours d'animation à chaque étape • fx: une référence à jQuery.fx objet prototype, qui contient un nombre de propriétés telles que elem pour l'élément animé, début et fin pour la première et la dernière valeur du propriété animée, respectivement, et accessoire pour la propriété en cours d'animation. Notez que la fonction step s'appelle pour chaque propriété animée sur chaque élément animé. Par exemple, étant donné deux éléments de liste, la fonction étape se déclenche quatre fois à chaque étape du animation:

$ ('li'). animate ({opacité: .5,
hauteur: '50% '}, {étape: function (maintenant, fx) { var data= fx.elem.id + '' + fx.prop + ':' + now; $ ('corps'). append ('' + données + ''); }});

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top