Retour aux cas pratiques
CSS3Avancé

Optimisation d'une animation CSS provoquant des saccades

Scénario

Contexte : Une interface comporte une animation de carte au survol utilisée dans un catalogue produit. Le Problème : L'animation provoque des saccades et une consommation CPU élevée sur certains navigateurs. Contraintes : Utiliser uniquement CSS3. Aucune librairie JavaScript autorisée. Code actuel : .card:hover { width: 310px; height: 410px; } Livrable attendu : Optimiser l'animation en utilisant transform et transition afin d'améliorer la performance et la fluidité.

Compétences ciblées

css3animationperformancetransformtransition
    Optimisation d'une animation CSS provoquant des saccades — mise en situation CSS3 | CodeDuel