Website/transitions.js

38 lines
1.5 KiB
JavaScript

window.onload = () => {
const anchors = document.querySelectorAll('a');
const trans1 = document.querySelector('header');
const trans2 = document.querySelector('.background');
const trans3 = document.querySelector('main');
for (let i = 0; i < anchors.length; i++) {
const anchor = anchors[i];
if (anchor.classList.contains("notransition"))
return;
anchor.addEventListener('click', e => {
e.preventDefault();
let target = e.target.href;
if (target[target.length - 1] == '#')
return;
let dest = `${target}`
if (dest.includes('nf')) {
document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--nfheadercolor'))
} else if (dest.includes('about')) {
document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--aboutheadercolor'))
} else {
document.documentElement.style.setProperty('--targetheadercolor', getComputedStyle(document.documentElement).getPropertyValue('--indexheadercolor'))
}
trans1.classList.add('out');
trans2.classList.add('out');
trans3.classList.add('out');
setTimeout(() => {
window.location.href = target;
}, 500);
});
}
}