Wicked CSS - Une nouvelle bibliothèque d'animation en pure CSS3
Grâce à CSS3, vous pouvez créer des animations folles sur le Web. Ceux-ci peuvent fonctionne sur tous les navigateurs et éléments de page pour contrôler les éléments de navigation, les menus déroulants, les onglets, vous le nommez.
En fait, vous pouvez même générer ces codes de manière dynamique à l'aide d'outils d'animation. Mais ceux-ci sont assez limités par rapport à une bibliothèque d'animation à part entière.
Wicked CSS est la plus récente bibliothèque du genre. Cela me rappelle le début Animate.css qui était assez simple et rudimentaire, mais pourrait être utilisé dans à peu près n'importe quel site Web.
Jetez un coup d’œil à la page d’accueil pour une démonstration en direct avec une liste de toutes les animations prises en charge. Au moment d'écrire cet article, je compte 24 styles d'animation au total, des diapositives aux rotations et effets de pulsation / rebondissement.
Beaucoup de ces animations sont des fonctionnalités uniques utilisées pour mettre un élément en vue (ou hors de vue). Ceci est pratique pour les pages avec des animations de défilement pour afficher des éléments de page spécifiques.
Mais vous pouvez aussi utilisez-le pour afficher (ou masquer) des éléments de page supplémentaires comme des menus déroulants, des barres de recherche, des formulaires d’inscription cachés ou autre chose. Voici une petite liste d'animations que vous pouvez choisir:
- Secouer
- Zoom avant / arrière
- Glisser vers le haut / bas
- Disparaître
- Rouler dedans / dehors
- Bounce et pop
- Rotation circulaire in / out
Tous ces styles d'animation sont conçus pour un usage unique. Ils peuvent être appelés plusieurs fois par page et par élément, mais ce ne sont pas des animations répétitives.
À la place, vous les utiliserez en fonction des effets de clic, de survol ou de balayage de l'utilisateur. Ils peuvent également être utilisés sur les boutons CTA pour les effets de pulsation / pulsation, mais cela nécessite une fonction de synchronisation JavaScript.
Jetez un coup d’œil à la page d’exemples pour un aperçu en direct et quelques détails supplémentaires. Vous trouverez également une documentation complète sur le site principal, ainsi que le rapport GitHub..
Wicked CSS est une bibliothèque plus récente, elle n’a donc pas encore beaucoup de succès. Mais la bibliothèque est stable et devrait rester dans les années à venir.