La bibliothèque Animate On Scroll (https://michalsnik.github.io/aos/) va permettre d’afficher des éléments HTML, des boîtes <div> contenant des images, du texte..., avec des effets d’apparition divers, lorsque ces éléments arriveront à l’écran lors de l’utilisation de la barre de défilement vertical.
De nombreux exemples vous sont proposés sur la page d’accueil du site et ils apparaîtront en utilisant la barre de défilement vertical :
Toute la documentation technique se trouve sur GitHub : https://github.com/michalsnik/aos
Pour exploiter cette bibliothèque, vous devez bien sûr l’installer et l’initialiser :
<script src="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js"></script> <script> AOS.init(); </script>
Vous devez aussi utiliser ses règles CSS, accessibles depuis un CDN :
<link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" rel="stylesheet">
Voici la page complète avec les liaisons CSS et JS, sans aucune animation :
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ma page</title> <link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" ...
Abonnement
tous les livres et vidéos ENI en illimité sans engagement
du livre imprimé ou du livre numérique