Difference between revisions of "Template:Vilnius-Lithuania/JS/Engineering"
| 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'));
});