bvandevliet/Vandevliet.AerialShots.Website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Some small fixes and optimizations.

Browse source
This commit is contained in:
Bob Vandevliet 2024-07-13 18:09:28 +02:00
parent 39c2c3d8c4
commit 8c2cfa180d
5 changed files with 121 additions and 106 deletions
Download patch file Download diff file Expand all files Collapse all files

81
src/js/scripts.js
View file

@ -1,53 +1,56 @@
/**
* @type {NodeListOf<HTMLVideoElement>}
*/
const parallaxElems = document.querySelectorAll('.parallax');
// Handle scroll events.
window.addEventListener('scroll', () =>
document.addEventListener('DOMContentLoaded', () =>
{
/**
* @type {NodeListOf<HTMLVideoElement>}
*/
const parallaxElems = document.querySelectorAll('.parallax');
// Handle scroll events.
window.addEventListener('scroll', () =>
{
// Add class to body when scrolled.
document.body.classList.toggle('is-scrolled', window.scrollY > 0);
document.body.classList.toggle('is-scrolled', window.scrollY > 0);
// Parallax effect.
parallaxElems.forEach(parallaxElem =>
{
const parentElem = parallaxElem.parentElement;
// Parallax effect.
parallaxElems.forEach(parallaxElem =>
{
const parentElem = parallaxElem.parentElement;
const parentRect = parentElem.getBoundingClientRect();
const parentScroll = parentRect.top + (parentRect.height / 2);
const parentRect = parentElem.getBoundingClientRect();
const parentScroll = parentRect.top + (parentRect.height / 2);
const windowScroll = window.scrollY + (window.innerHeight / 2);
const windowScroll = window.scrollY + (window.innerHeight / 2);
parallaxElem.style.top = `${(windowScroll - parentScroll) / 4}px`;
parallaxElem.style.top = `${(windowScroll - parentScroll) / 4}px`;
});
});
});
/**
* @type {NodeListOf<HTMLElement>}
*/
const sections = document.querySelectorAll('.section');
/**
* @type {NodeListOf<HTMLElement>}
*/
const sections = document.querySelectorAll('.section');
sections.forEach(section =>
{
if (section.id)
sections.forEach(section =>
{
const anchor = document.createElement('a');
anchor.className = 'anchor-link';
anchor.href = `#${section.id}`;
anchor.innerHTML = ' #&nbsp;';
section.appendChild(anchor);
}
});
if (section.id)
{
const anchor = document.createElement('a');
anchor.className = 'anchor-link';
anchor.href = `#${section.id}`;
anchor.innerHTML = ' #&nbsp;';
section.appendChild(anchor);
}
});
document.querySelectorAll('#navbarNav li.nav-item>a').forEach(anchor =>
{
anchor.addEventListener('click', () =>
document.querySelectorAll('#navbarNav li.nav-item>a').forEach(anchor =>
{
/**
* @type {HTMLButtonElement}
*/
const navbarNav = document.querySelector('button.navbar-toggler[aria-expanded="true"]');
navbarNav?.click();
anchor.addEventListener('click', () =>
{
/**
* @type {HTMLButtonElement}
*/
const navbarNav = document.querySelector('button.navbar-toggler[aria-expanded="true"]');
navbarNav?.click();
});
});
});