scroll2078

Greasy Fork is available in English.

navigation bar behavior based on scroll bar

当前为 2024-04-01 提交的版本，查看最新版本。

此脚本不应直接安装。它是供其他脚本使用的外部库，要使用该库请加入元指令 // @require https://update.greasyfork.icu/scripts/491240/1352560/scroll2078.js

换行

document.addEventListener('DOMContentLoaded', function() { // Corrected syntax
    createElementNavbar();

    // Wait until the navbar is created before querying it
    setTimeout(() => {
        const navbar = document.querySelector('.navigation + .header + .navbar');
        let lastScrollTop = 0;

        navbar.style.top = '-20px'; // Initial position set to -20px

        function handleScroll() {
            let scrollTop = window.pageYOffset || document.documentElement.scrollTop;
            let delta = scrollTop - lastScrollTop;

            if (delta > 0) {
                // Scrolling down
                navbar.style.top = '-52px'; // Hide the navbar completely
            } else {
                // Scrolling up
                // Calculate the new top value based on scroll position, but don't exceed top: 0
                let newTop = Math.max(-52, -20 + (scrollTop - lastScrollTop) + parseInt(navbar.style.top, 10));
                navbar.style.top = `${Math.min(newTop, 0)}px`;
            }

            lastScrollTop = scrollTop;
        }

        window.addEventListener('scroll', handleScroll);
    }, 100); // A brief delay to ensure the navbar exists
});