Animation

Faire tourner un élément à l'infini

outils :
Illustration croce

Sommaire

Vidéo

1. Sélectionnez l’élément qui va déclencher l’animation

  1. Sélectionnez l’élément que vous souhaitez faire tourner (ex : circle)
  2. Cliquez dans le panneau d’interaction et choisissez le trigger “Scroll into view”

2. Créez l’animation

1. Sélectionnez l’animation “Rotate”

2. Attribuez une position par défaut à l’élément : 0 DEG et 0s Duration

3. Ajoutez une transition pour modifier la position de l’élément et indiquez la durée de l’animation : 360 DEG en 15 sec (par exemple)

4. Ajoutez une transition pour que l’élément reprenne sa position par défaut une fois la rotation terminée : 0 DEG et 0s Duration

3. Appliquez la caractéristique Loop à l’animation

Cochez “Loop” au niveau du trigger pour que l’animation se fasse en boucle

Ces tutoriels pourraient vous intéresser

Nos tutoriels de la même catégorie

Rendre un élément déplaçable sur son site web

Webflow
Embed
Animation

Faire défiler un élément en boucle

Webflow
Animation

Ajouter une animation de machine à écrire

Webflow
Embed
Animation
Voir tous nos tutoriels
Illustration traits
Nous utilisons les meilleurs outils

Votre site est développé avec les meilleurs outils et les meilleurs pratiques

Gemeos ne vous propose pas simplement un site web, mais une expertise sur les meilleurs outils pour vous garantir un retour sur investissement optimal. 

Figma

Pour designer votre site web sur mesure et optimiser son taux de conversion

Webflow

Pour une intégration pixel perfect et optimisée de votre site web

Client-first

Pour une organisation aux petits oignons de votre projet

Wized

Pour ajouter des fonctionnalités avancées à votre projet

Make

Pour automatiser vos fluxs de travail et vous faire gagner un max de temps