Índice

Crear una animación

La función animate() le permite crear y configurar sus propias animaciones, siguiendo su propia creatividad.

animate(parámetros, velocidad, easing, función a la que se llama)

El aspecto clave de esta función es el objeto que componen las propiedades de estilo en las que se basará la animación. Cada parámetro del objeto representa una propiedad en la que se apoyará la animación (por ejemplo: height, top u opacity). El valor asociado a la clave indica cómo se animará la propiedad. Si el valor es un número, el estilo de la propiedad pasará de su valor actual al valor especificado. Si se especifican los valores hide, show o toggle, se construye una animación por defecto para esta propiedad.

Observe que estas propiedades se tienen que especificar siguiendo la notación JavaScript (CamelCase). Por ejemplo marginLeft en lugar de la notación CSS margin-left.

  • parámetros: contenedores de atributos de estilo que desea animar y con qué valor.

  • velocidad (opcional): cadena de caracteres que representa una de las tres velocidades predefinidas (’slow’, ’normal’ o ’fast’) o el número en milisegundos correspondiente a la duración del efecto.

animate( {fontSize:"24px", left:300, width: "200px", opacity: 0.5} , 1000 )

o

$("p").animate({ height: ’toggle’, opacity: ’toggle’ }, "slow");
  • easing (opcional): nombre del efecto personalizado ...