28172 sujets

CSS et mise en forme, CSS3

Bonsoir,

Je souhaiterai utiliser une propriété type "webkit-transform", afin de disposer de plusieurs divs "flip cards" mais ce qui m'inquiète est l'absence de l'animation pour de vieux navigateurs.

Comment pallier à cela en réalisant un mode dégradé ?

Merci d'avance !
Il faut tout simplement que l’état de départ de ton animation soit consultable sans animation.

L’expression « Amélioration progressive » pourrait t’intéresser, si tu as un peu de temps de lecture disponible.

PS : -webkit-transform seul est une immondice, tu dois absolument utiliser la propriété standard transform. Tu peux constater le support actuel de transform sur CanIUse.
Modifié par Ten (10 Dec 2014 - 08:49)
J'ai essayé ce principe pour le principe de "flip cards" dans un menu "modal"...
Je suis parti pendant 2h sur du JS avec plein de plugins déjà réalisés... C'est rapidement lourd à gérer concernant l'état initial, le retour à l'état initial sur un mouseenter et mouseleave...

J'opte donc pour un transform CSS3, avec en cas de vieux naviguateur, pas d'effet flipcard mais le côté essentiel de la card.

Et au loading du site, un avertissement si naviguateur oldie.

Merci encore.