Comprendre les transitions CSS (ease) sur Webflow

Documentation
3 min
Publié le Nov 21, 2022
Dernière mise à jour le
Ease editor animations dans webflow
Résumez cet article avec une IA
Points clés de l'article

Lorsque vous faites des animations sur webflow, vous pouvez utiliser différents "mode" pour définir la façon dont l'animation va progresser. Combiné à une valeur temps (timing), ce choix joue un rôle important dans l'effet final de votre animation.

Les choix d'animations par défaut

Par défaut, vous avez dans l'interface designer de webflow la possibilité d'ajouter les 5 styles d'animations les plus populaires.

Transition Linear

L'animation aura la même vitesse du début à la fin.

Transition Ease

C'est le mode utilisé par défaut pour les animations CSS. L'animation aura un départ lent puis rapide, puis finira lentement.

Transition Ease-in

L'animation a un départ lent.

Transition Ease-out

L'animation a une fin lente.

Transition Ease-in-out

L'animation a un départ et une fin lente.

Tableau récapitulatif des transitions CSS

Tableau récapitulatif (contenu en anglais)

Tableau récapitulatif des values des animations CSS (ease)

Vue des fonctionnalités depuis l'interface webflow

Accès depuis les triggers ⚡️(Js Animations)

Panel d'option de style de transition pour les animations triggers dans webflow

Accès depuis le CSS (transitions style)

Easing editor dans l'interface designer de webflow

Découvrez une prévisualisation visuelle de l'ensemble des ease effect sur ce projet Webflow !

Démonstration visuels des différents effet Ease sur Webflow
Florian Bodelot
Florian Bodelot
Co-fondateur

Articles qui devraient vous intéresser

Graphique de performance historique du fonds
Documentation
Développement

Pages fonds : comment structurer la gamme d’une société de gestion sur son site web

Pages fonds : comment structurer la gamme d’une société de gestion sur son site web
Visuel promotionnel de Webflow Conf 2026 mettant en avant Lucas Clairet, finaliste dans la catégorie « Developer of the Year ». Son portrait en noir et blanc est placé devant un fond graphique abstrait aux couleurs bleu, orange, vert et rose, avec une identité visuelle moderne et contrastée. Le logo vertical de Webflow Conf ’26 apparaît à gauche, tandis que son nom et la mention « Finalist – Developer of the Year » sont affichés dans un encadré noir.
News
Webflow

Lucas Clairet finaliste des Webflow Awards 2026 dans la catégorie Developer of the Year

Lucas Clairet finaliste des Webflow Awards 2026 dans la catégorie Developer of the Year
Vue d’ensemble de Webflow AEO regroupant les recommandations IA, les analytics, le suivi des prompts et les optimisations SEO dans une interface unique.
Documentation
Webflow

Webflow AEO : l’Answer Engine Optimization directement intégré à la plateforme

Webflow AEO : l’Answer Engine Optimization directement intégré à la plateforme
Les meilleurs projets web
commencent par une conversation
Abstract composition of black and gold metallic ribbons with elegant light reflections and smooth gradients. A premium background conveying luxury, modernity, and innovation.