Comment réaliser un effet Ken Burns sur une section plein écran ?
L’effet Ken Burns, c’est quoi ?
L’effet Ken Burns est un type d’effet de panoramique et de zoom utilisé dans la production de films et de vidéos à partir d’images fixes. En termes simples, l’effet Ken Burns est un effet qui donne du mouvement aux images fixes et donne vie à ces images. Très largement utilisé dans les documentaires, il donnera à votre site web une tout autre dimension.
Qu’est-ce que vous trouverez dans la vidéo ?
Dans cette vidéo, je vous explique pas à pas comment réaliser un effet Ken Burns sur une section Hero.
Enjoy😎
Classe CSS à positionner dans le module « curseur de défilement »
dfhs-1
Code CSS à positionner dans le module « code en pleine largeur »
.dfhs-1 .et_pb_slide .et_parallax_bg {
animation: dfhs-ken-burn 15s forwards;
animation-iteration-count: infinite;
}
@keyframes dfhs-ken-burn {
0% {
transform: scale3d(1.4, 1.4, 1.4);
animation-timing-function: linear;
}
100% {
transform: scale3d(1, 1, 1);
}
}