Animación CSS3 o jQuery con paso dado

Tengo un CSS que hace que el efecto de desvanecimiento.

#mainframe.normal { opacity: 1.0; } #mainframe.faded { opacity: 0.0; } #mainframe { /* Firefox */ -moz-transition-property: opacity; -moz-transition-duration: 3s; /* WebKit */ -webkit-transition-property: opacity; -webkit-transition-duration: 3s; /* Standard */ transition-property: opacity; transition-duration: 3s; } 

Está controlado por el siguiente script:

 document.getElementById('mainframe').className = "faded"; 

Desafortunadamente, no hay ningún parámetro en CSS, que establece qué paso se debe usar, solo el tiempo total de toda la animación y la función Bezier (lenta, rápida …). Lo estaba buscando en jQuery, pero jQuery parece no tener ese parámetro también.

¿Hay una manera de establecer un tiempo de espera de un solo fotogtwig (o, lo que es lo mismo, cuántos fotogtwigs se deben usar)?

Lo necesito para tratar de mejorar la suavidad en el iPhone (supongo que pasos menores == mayor rendimiento).

Saludos,

Parece que estás buscando la funcionalidad proporcionada por las animaciones de fotogtwigs clave css3.

Más información está disponible en los siguientes enlaces:

https://developer.mozilla.org/en/CSS/CSS_animations

https://developer.mozilla.org/en/CSS/@keyframes

Compatible con los navegadores webkit (safari, chrome) y FF5 +.

Es posible que desee comprobar esto: Animate.css .