feat: slight optimization
This commit is contained in:
@@ -93,15 +93,26 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
document.addEventListener('astro:page-load', () => {
|
document.addEventListener('astro:page-load', () => {
|
||||||
|
let ticking = false;
|
||||||
const onScroll = () => {
|
const onScroll = () => {
|
||||||
document.documentElement.style.setProperty('--scroll-offset', `${window.scrollY}px`);
|
if (!ticking) {
|
||||||
document.documentElement.classList.add('has-js');
|
window.requestAnimationFrame(() => {
|
||||||
|
document.documentElement.style.setProperty('--scroll-offset', `${window.scrollY}px`);
|
||||||
|
ticking = false;
|
||||||
|
});
|
||||||
|
ticking = true;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
window.removeEventListener('scroll', onScroll);
|
|
||||||
window.addEventListener('scroll', onScroll, { passive: true });
|
window.addEventListener('scroll', onScroll, { passive: true });
|
||||||
|
|
||||||
onScroll();
|
onScroll();
|
||||||
|
|
||||||
|
document.documentElement.classList.add('has-js');
|
||||||
|
|
||||||
|
document.addEventListener('astro:before-swap', () => {
|
||||||
|
window.removeEventListener('scroll', onScroll);
|
||||||
|
}, { once: true });
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -129,6 +140,7 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
|
|||||||
|
|
||||||
-webkit-mask-position-y: var(--scroll-offset);
|
-webkit-mask-position-y: var(--scroll-offset);
|
||||||
mask-position-y: var(--scroll-offset);
|
mask-position-y: var(--scroll-offset);
|
||||||
|
will-change: mask-position;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Background that creates the "glimmer" effect */
|
/* Background that creates the "glimmer" effect */
|
||||||
|
|||||||
Reference in New Issue
Block a user