Aller au contenu
Forge

Bouton retour en haut de page

Un bouton flottant qui apparaît après un défilement, remonte en douceur en haut de page et montre la progression de lecture.

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

Description

Le bouton se montre dès que le lecteur a dépassé le premier écran ; son anneau se remplit au fil de la lecture, calculé une fois par image. Il remonte en douceur, ou instantanément avec prefers-reduced-motion, puis place le focus en haut de page pour que la navigation au clavier reprenne au bon endroit. Sans JavaScript, c'est un simple lien d'ancre, toujours visible et fonctionnel.

Code

Chargement du code…

Contenu de l'archive

bouton-retour-en-haut-html-tailwind.zip3 fichiers · 6 Ko

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

Mots-clés

Mis à jour le 15 octobre 2026.

Dans le même esprit

  • Sommaire de page

    Gratuit

    Une table des matières qui suit la lecture d'un long article et surligne la section en cours.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant

  • Pagination

    Gratuit

    Une pagination complète avec page courante, points de suspension et flèches précédent/suivant correctement désactivées.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant

  • Menu déroulant

    Gratuit

    Une barre de navigation avec sous-menus déroulants qui se ferment à la touche Échap, au clic extérieur ou quand le focus quitte le menu.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant

  • Fil d'Ariane

    Gratuit

    Un fil d'Ariane accessible qui situe la page dans le site et se resserre sur mobile pour tenir sur une ligne.

    • Tailwind
    • React
    • CSS
    • WordPress
    Composant