Initial Hugo gallery site with custom landing page
- 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>
This commit is contained in:
@@ -0,0 +1,39 @@
|
||||
(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;
|
||||
});
|
||||
})();
|
||||
Reference in New Issue
Block a user