Line 54: | Line 54: | ||
} | } | ||
//move footer to main tag | //move footer to main tag | ||
− | + | window.addEventListener('load', function() { | |
− | + | document.querySelector('main').appendChild(document.getElementById('footerWrapper')); | |
− | + | }); |
Revision as of 11:26, 11 October 2020
//cycles let engCyc = document.querySelector('#engineering-cycle svg'); let dtpCyc = document.querySelector('#dtp-cycle svg'); let stopEl = document.querySelector('.spacer'); let isMobile = false; let eXc, eYc, dXc, dYc let innHeight = 700
window.addEventListener('load', function() {
if (window.innerWidth < 767) { if (window.innerWidth < window.innerHeight) isMobile = true } else { isMobile = false; } eXc = window.innerWidth * (isMobile ? 0 : 0.5); eYc = window.innerHeight * (isMobile ? 0.6 : 0.7); dXc = window.innerWidth * (isMobile ? 0 : 0.1); dYc = window.innerHeight * (isMobile ? 1 : 1.2) innHeight = window.innerHeight;
})
window.addEventListener('resize', function() {
if (window.innerWidth < 767) { if (window.innerWidth < window.innerHeight) isMobile = true } else { isMobile = false; } eXc = window.innerWidth * (isMobile ? 0 : 0.5); eYc = window.innerHeight * (isMobile ? 0.6 : 0.7); dXc = window.innerWidth * (isMobile ? 0 : 0.1); dYc = window.innerHeight * (isMobile ? 1 : 1.2) innHeight = window.innerHeight;
})
window.addEventListener("scroll", () => {
if (stopEl.getBoundingClientRect().top > 0) { let dist = window.scrollY / innHeight; engCyc.style.transform = `scale(${1 - dist * (isMobile ? 0.5 : 0.65)}) translate(-${dist * eXc}px,-${dist * eYc}px)`; dtpCyc.style.transform = `scale(${1 - dist * (isMobile ? 0.15 : 0.3)}) translate(${dist * dXc}px,-${dist * dYc}px)`; }
}); //waves var setWaveParams = () => {
let container = document.querySelector(".milkWave"); return { width: container.offsetWidth, height: container.offsetHeight, waveWidth: container.offsetWidth, waveHeight: container.offsetHeight * 0.2, waveDelta: 25, speed: 0.15, wavePoints: 5, }; } //move footer to main tag window.addEventListener('load', function() { document.querySelector('main').appendChild(document.getElementById('footerWrapper'));
});