Code de la vidéo Bricks Builder Custom Animation

				
					add_filter( 'bricks/setup/control_options', function( $options ) {
  // Add custom animation into animationTypes
  // Note that the key is very important, must be unique
  $options['animationTypes']['pedroMove'] = esc_html__( 'Custom animation', 'bricks' );

  return $options;
}, 10 );

				
					.brx-animate-pedroMove {
animation-name: pedroMove;
}
@keyframes pedroMove {
0% {
animation-timing-function: ease-in;
opacity: 0;
transform: translateY(-250px);
}
38% {
animation-timing-function: ease-out;
opacity: 1;
transform: translateY(0);
}
55% {
animation-timing-function: ease-in;
transform: translateY(-65px);
}
72% {
animation-timing-function: ease-out;
transform: translateY(0);
}
81% {
animation-timing-function: ease-in;
transform: translateY(-28px);
}
90% {
animation-timing-function: ease-out;
transform: translateY(0);
}
95% {
animation-timing-function: ease-in;
transform: translateY(-8px);
}
100% {
animation-timing-function: ease-out;
transform: translateY(0);
}
}

Laisser un commentaire Annuler la réponse