Date de création : 2025/01/10 14:01

Voici un petit code JavaScript qui permet d'agrandir de quelques pixels la barre de navigation quand le scroll est à zéro.

    document.addEventListener('DOMContentLoaded', function () {
        const navBar = document.getElementById('masthead'); // Sélection de la barre de navigation
 
        // Ajouter un écouteur d'événement pour le scroll
        window.addEventListener('scroll',function () {
            if (window.scrollY === 0) {
                // Agrandir la barre de navigation si le scroll est à 0
                navBar.style.height = '95px'; // 80px (taille initiale) + 15px
                navBar.style.transition = 'height 0.3s ease'; // Animation douce
            } else {
                // Réduire la barre de navigation si le scroll est supérieur à 0
                navBar.style.height = '80px'; // Taille initiale
                navBar.style.transition = 'height 0.3s ease'; // Animation douce
            }
        });
    });

Page dans la catégorie: