Cambiar el comportamiento de flexión de jQuery

Question

Cuando tienes una facilidad para una animación, la animación sigue la ecuación de esa flexibilización. Este guion describe lo que quiero decir muy bien.

Supongamos que elegí una flexibilización, cualquier flexibilización y un tiempo de animación, por ejemplo, 1000 ms. La animación seguirá por completo la ecuación de flexibilización. Si dividí el tiempo a 500 ms, el período de animación se dividirá, pero llenará la misma ecuación de facilitación.

Lo que quiero hacer es no dividir solo el tiempo, sino también la ecuación de flexibilización. Esa es la animación completa, pero no sigue la ecuación completa sino solo la mitad.

Es un poco complicado, lo sé, me pregunto si hay una solución.

Answer 1

Echaría un vistazo a la función de paso (http://api.jquery.com/animate/). Dependiendo de la colección/objeto que esté animando, esta podría ser una solución a su problema. Otro buen artículo para leer es http://www.bennadel.com/blog/1856-using-jquery-s-animate-step-callback-function-to-create-custom-animations.htm. Espero que ayude:

Función de paso La segunda versión de .animate () proporciona una opción de paso: una función de devolución de llamada que se dispara en cada paso de la animación. Esta función es útil para habilitar tipos de animación personalizados o alterar la animación a medida que ocurre. Acepta dos argumentos (ahora y FX), y esto se establece en el elemento DOM que se anima.

• Ahora: el valor numérico de la propiedad que se anima en cada paso • FX: una referencia al objeto prototipo jquery.fx, que contiene una serie de propiedades, como elem para el elemento animado, inicio y finalización para el primer y último valor de la propiedad animada, respectivamente, y el apoyo para la propiedad animada. Tenga en cuenta que se requiere la función de paso para cada propiedad animada en cada elemento animado. Por ejemplo, dados dos elementos de lista, la función de paso se dispara cuatro veces en cada paso de la animación:

$ ('li'). Animate ({Opacidad: .5,
altura: '50%'}, {paso: function (ahora, fx) {var data = fx.elem.id +' '' + fx.prop + ':' + ahora; $ ('Body'). Append ('' + data + ''); }});