yvierkoetter
f481646821
- Hugo site with nicokaiser/hugo-theme-gallery (git submodule) - Full-viewport hero with parallax scrolling (bg at 70%, text at 85% speed) - Entrance animations on hero title and subtitle - Bouncing scroll arrow that fades out on scroll - Header suppressed on homepage, shown on all other pages - Intro text section between hero and album grid - Cats placeholder album with 8 images - .gitignore excludes public/, resources/, .hugo_build.lock, .idea/ Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
40 lines
1.1 KiB
JavaScript
40 lines
1.1 KiB
JavaScript
(function () {
|
|
var hero = document.querySelector('.hero');
|
|
if (!hero) return;
|
|
|
|
var heroBg = hero.querySelector('.hero-bg');
|
|
var heroFg = hero.querySelector('.hero-fg');
|
|
var heroScroll = hero.querySelector('.hero-scroll');
|
|
var heroH = hero.offsetHeight;
|
|
var ticking = false;
|
|
|
|
function update() {
|
|
var s = window.scrollY;
|
|
if (s > heroH) { ticking = false; return; }
|
|
|
|
// Background: moves at ~70% of scroll speed (30% slower)
|
|
if (heroBg) heroBg.style.transform = 'translateY(' + (s * 0.3) + 'px)';
|
|
|
|
// Foreground text: moves at ~85% of scroll speed (15% slower)
|
|
if (heroFg) heroFg.style.transform = 'translateY(' + (s * 0.15) + 'px)';
|
|
|
|
// Scroll arrow: fades out in the first 25% of the hero height
|
|
if (heroScroll) {
|
|
heroScroll.style.opacity = Math.max(0, 1 - s / (heroH * 0.25)).toFixed(3);
|
|
}
|
|
|
|
ticking = false;
|
|
}
|
|
|
|
window.addEventListener('scroll', function () {
|
|
if (!ticking) {
|
|
requestAnimationFrame(update);
|
|
ticking = true;
|
|
}
|
|
}, { passive: true });
|
|
|
|
window.addEventListener('resize', function () {
|
|
heroH = hero.offsetHeight;
|
|
});
|
|
})();
|