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>
|
||||
|
||||
<button class="story-totop" id="trip-totop" aria-label="Back to top">↑ Top</button>
|
||||
|
||||
<script type="module">
|
||||
import PhotoSwipeLightbox from 'https://cdn.jsdelivr.net/npm/photoswipe@5/dist/photoswipe-lightbox.esm.min.js';
|
||||
const lightbox = new PhotoSwipeLightbox({
|
||||
|
||||
Reference in New Issue
Block a user