Retour aux cas pratiques
Tailwind CSSAvancé

Optimisation d'une carte interactive avec transitions performantes

Scénario

Contexte : Une galerie produit utilise des effets au survol pour agrandir légèrement les cartes. Le Problème : L'effet actuel provoque des sauts de layout car il modifie les dimensions. Contraintes : Utiliser uniquement les classes Tailwind et privilégier transform et transition. Code actuel : <div class="hover:w-80 transition-all"> Carte produit </div> Livrable attendu : Refactoriser l'effet hover afin d'utiliser scale et transform pour garantir une animation fluide sans décalage.

Compétences ciblées

tailwindanimationtransformtransitionperformance
    Optimisation d'une carte interactive avec transitions performantes — mise en situation Tailwind CSS | CodeDuel