feat(trip): add back-to-top button
Reuses .story-totop styles. Appears after scrolling past 80% of viewport height, smooth-scrolls to top on click. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Vgmzx8VTTTmCskSpQtsLTr
This commit is contained in:
@@ -559,8 +559,28 @@ function parseGpxFiles(urls, callback) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
/* ── Back to top ─────────────────────────────────────────── */
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
var btn = document.getElementById('trip-totop');
|
||||||
|
if (!btn) return;
|
||||||
|
var threshold = window.innerHeight * 0.8;
|
||||||
|
var shown = false;
|
||||||
|
btn.addEventListener('click', function () {
|
||||||
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||||
|
});
|
||||||
|
window.addEventListener('scroll', function () {
|
||||||
|
var shouldShow = window.scrollY > threshold;
|
||||||
|
if (shouldShow !== shown) {
|
||||||
|
shown = shouldShow;
|
||||||
|
btn.classList.toggle('is-visible', shown);
|
||||||
|
}
|
||||||
|
}, { passive: true });
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<button class="story-totop" id="trip-totop" aria-label="Back to top">↑ Top</button>
|
||||||
|
|
||||||
<script type="module">
|
<script type="module">
|
||||||
import PhotoSwipeLightbox from 'https://cdn.jsdelivr.net/npm/photoswipe@5/dist/photoswipe-lightbox.esm.min.js';
|
import PhotoSwipeLightbox from 'https://cdn.jsdelivr.net/npm/photoswipe@5/dist/photoswipe-lightbox.esm.min.js';
|
||||||
const lightbox = new PhotoSwipeLightbox({
|
const lightbox = new PhotoSwipeLightbox({
|
||||||
|
|||||||
Reference in New Issue
Block a user