From 7bb90fc88eaac8767f0f5f780cc2b3a9f6c5f3fe Mon Sep 17 00:00:00 2001 From: BigCoke233 Date: Thu, 22 Jan 2026 11:59:31 +0800 Subject: fix: back-to-top falsely initialized when not needed --- assets/js/back2top.js | 99 ++++++++++++++++++++++++++------------------------- 1 file changed, 51 insertions(+), 48 deletions(-) diff --git a/assets/js/back2top.js b/assets/js/back2top.js index 86f8d11d..6d7501e1 100644 --- a/assets/js/back2top.js +++ b/assets/js/back2top.js @@ -6,52 +6,55 @@ const backToTopButton = document.getElementById("back2top-button") const backToTopInstruction = document.getElementById("back2top-instruction") const seenAndUsedBat = localStorage.getItem("geedeapro.ui.seenAndUsedBat") -function hideInstruction() { - backToTopInstruction.remove() +if (backToTopInstruction && backToTopButton) { + function hideInstruction() { + backToTopInstruction.remove() + } + if (seenAndUsedBat) hideInstruction() + + // listen to button click and scroll to top + backToTopButton.addEventListener("click", () => { + window.scrollTo({ top: 0, behavior: "smooth" }) + if (!seenAndUsedBat) { + localStorage.setItem("geedeapro.ui.seenAndUsedBat", true); + hideInstruction(); + } + }) + + // listen to scroll and toggle button visibility + let lastOffset = window.scrollY + + window.addEventListener("scroll", () => { + const offset = window.scrollY + const batIsHidden = backToTop.classList.contains("-top-25") + const enoughHeight = offset >= 2000 + const isScrollingUp = offset < lastOffset + const isScrollingDown = offset > lastOffset + + function hide() { + backToTop.classList.remove("top-0") + backToTop.classList.add("-top-25") + backToTop.classList.remove("animate-head-shake") + } + + function show() { + backToTop.classList.remove("-top-25") + backToTop.classList.add("top-0") + backToTop.classList.add("animate-head-shake") + } + + if (enoughHeight && isScrollingUp && batIsHidden) { + // show only when scrolling up + show() + } else if (isScrollingDown && !batIsHidden) { + // hide as soon as user scrolls down again + hide() + } + + // hide no matter what if too close to top + if (!enoughHeight) hide() + + lastOffset = offset + }) } -if (seenAndUsedBat) hideInstruction() - -// listen to button click and scroll to top -backToTopButton.addEventListener("click", () => { - window.scrollTo({ top: 0, behavior: "smooth" }) - if (!seenAndUsedBat) { - localStorage.setItem("geedeapro.ui.seenAndUsedBat", true); - hideInstruction(); - } -}) - -// listen to scroll and toggle button visibility -let lastOffset = window.scrollY - -window.addEventListener("scroll", () => { - const offset = window.scrollY - const batIsHidden = backToTop.classList.contains("-top-25") - const enoughHeight = offset >= 2000 - const isScrollingUp = offset < lastOffset - const isScrollingDown = offset > lastOffset - - function hide() { - backToTop.classList.remove("top-0") - backToTop.classList.add("-top-25") - backToTop.classList.remove("animate-head-shake") - } - - function show() { - backToTop.classList.remove("-top-25") - backToTop.classList.add("top-0") - backToTop.classList.add("animate-head-shake") - } - - if (enoughHeight && isScrollingUp && batIsHidden) { - // show only when scrolling up - show() - } else if (isScrollingDown && !batIsHidden) { - // hide as soon as user scrolls down again - hide() - } - - // hide no matter what if too close to top - if (!enoughHeight) hide() - - lastOffset = offset -}) + -- cgit v1.2.3