Aller au contenu

Révélation au défilement

Des étapes qui apparaissent en fondu et en glissant à mesure qu’on fait défiler la page, sans script.

  • Tailwind
  • React
  • CSS
  • WordPress
Ouvrir dans un nouvel onglet

Description

Chaque carte entre en scène en fondu, en remontant légèrement, au moment précis où elle arrive à l’écran, puis reste en place : l’animation suit le défilement grâce aux animations CSS liées à la vue (animation-timeline: view()), sans JavaScript ni Intersection Observer. Les navigateurs qui ne les connaissent pas affichent simplement les cartes. Le contenu reste une vraie liste ordonnée de titres et de textes. Avec prefers-reduced-motion, tout est affiché d’emblée.

Code

Chargement du code…

Contenu de l'archive

effet-revelation-defilement-html-tailwind.zip3 fichiers · 4 Ko

  • index.html8 Ko
  • README.md3 Ko
  • LICENSE.md1 Ko

Mots-clés

Mis à jour le 18 octobre 2026.

Dans le même esprit

  • Un titre dont les mots clés se font surligner l’un après l’autre, comme d’un coup de marqueur fluo.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant
  • Une annonce posée sur de petites bulles qui montent doucement du bas de la section en ondulant, puis s’évanouissent.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant
  • Un titre en néon rose encadré d’un tube bleu, dont la lueur grésille de temps en temps comme une vraie enseigne.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant
  • Une annonce de saison derrière laquelle des feuilles d’automne tombent en se balançant doucement.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant