08 Anime un composant

2021-09-30 11:44

Array() no author 77473

Tutorial, Get started,

Rendez votre site web plus dynamique en animant vos images ou d'autres éléments.

Notre plateforme vous permet d'ajouter des effets d'animation que vous pouvez appliquer à n'importe quel composant de vos pages.
 
En parcourant une page, l'effet d'animation ne sera affiché que la première fois que le composant auquel il a été appliqué devient visible à l'écran.
 
Pour activer l'animation, il suffit de cliquer avec le bouton droit de la souris sur le composant auquel vous souhaitez appliquer l'animation et dans le menu, faites défiler jusqu'à Animations.

Voici une description des effets d'animation que vous pouvez ajouter :
 
- Fade in : fondu en entrée, où le composant s'affiche progressivement.
 
- Slide up, down, left, right : le composant glisse vers le haut, vers le bas, vers la gauche ou vers la droite jusqu'à sa position finale.
 
- Slide Expand up : le composant, initialement de taille réduite, glisse vers le haut jusqu'à sa position finale puis ses dimensions reviennent à leur état initial.
 
- Expand up : le composant s'étend vers le haut.
 
- Expand open : le composant s'ouvre en grand puis se rétracte pour retrouver sa taille d'origine.
 
- Big entrance : une entrée "triomphale" avec zoom et légère rotation.
 
- Hatch : le composant s'étend tout en effectuant une légère rotation.
 
- Bounce : le composant rebondit jusqu'à trouver sa position finale.
 
- Pull up, down : le composant se "déroule" vers le haut (ou vers le bas).
 
- Stretch left, right : le composant s'étire vers la gauche (ou la droite).
 
- Fade in scale : le composant, tout en apparaissant en fondu, se développe en zoom jusqu'à revenir à sa taille initiale.
 
Il existe également 3 types d'animations continues :
 
- Pulse : une pulsation rythmique.
 
- Floating : une fluctuation constante vers le haut et vers le bas.
 
- Tossing : le composant effectue une légère rotation dans le sens des aiguilles d'une montre puis dans le sens inverse.

 

À savoir : En faisant défiler vers le bas, vous pouvez gérer le délai, c'est-à-dire le temps avant que l'animation ne soit affichée, et la durée de l'animation, c'est-à-dire combien de secondes doit durer toute l'animation, via les réglages de Delai et Durée.