mirror of
https://github.com/Fluffy-Bean/GameExpo23.git
synced 2025-05-14 14:22:16 +00:00
Fix shitty JS
This commit is contained in:
parent
f9bd75e58d
commit
b12de32a67
2 changed files with 11 additions and 10 deletions
|
@ -1,3 +1,3 @@
|
|||
const defaultTitle="DV8 Game Expo <span>2023</span>";let prevTitle;window.onscroll=()=>{scrollFunction();checkSection();};window.onload=()=>{scrollFunction()};function scrollFunction(){let nav=document.querySelector("nav");let scrollHeight=0;if(document.body.scrollTop>scrollHeight||document.documentElement.scrollTop>scrollHeight){nav.classList.add("scrolled");}else{nav.classList.remove("scrolled");}}
|
||||
function checkSection(){let navTitle=document.querySelector("nav > h1");let sections=document.querySelectorAll("section");if(window.pageYOffset<sections[0].offsetTop){if(prevTitle===defaultTitle)return;navTitle.innerHTML=defaultTitle;navTitle.style.animation="title-change 0.2s ease-in-out";prevTitle=defaultTitle;setTimeout(()=>{navTitle.style.animation="";},200);}
|
||||
sections.forEach((section)=>{let top=section.offsetTop;let bottom=section.offsetTop+section.offsetHeight;if(window.pageYOffset>=top&&window.pageYOffset<bottom){if(prevTitle===section.id)return;navTitle.innerHTML=section.id;navTitle.style.animation="title-change 0.2s ease-in-out";prevTitle=section.id;setTimeout(()=>{navTitle.style.animation="";},200);}});}
|
||||
const defaultTitle="DV8 Game Expo <span>2023</span>";const spacing=48;let prevElement=null;window.onscroll=()=>{scrollFunction();checkSection();};window.onload=()=>{scrollFunction()};function scrollFunction(){let nav=document.querySelector("nav");let scrollHeight=0;if(document.body.scrollTop>scrollHeight||document.documentElement.scrollTop>scrollHeight){nav.classList.add("scrolled");}else{nav.classList.remove("scrolled");}}
|
||||
function checkSection(){let navTitle=document.querySelector("nav > h1");let sections=document.querySelectorAll("section");if((window.pageYOffset+spacing)<sections[0].offsetTop){if(prevElement===null)return;navTitle.innerHTML=defaultTitle;navTitle.style.animation="title-change 0.2s ease-in-out";prevElement=null;setTimeout(()=>{navTitle.style.animation="";},200);}
|
||||
sections.forEach((section)=>{let top=section.offsetTop;let bottom=section.offsetTop+section.offsetHeight;if((window.pageYOffset+spacing)>=top&&window.pageYOffset<(bottom-spacing)){if(prevElement===section)return;navTitle.innerHTML=section.id;navTitle.style.animation="title-change 0.2s ease-in-out";prevElement=section;setTimeout(()=>{navTitle.style.animation="";},200);}});}
|
|
@ -1,5 +1,6 @@
|
|||
const defaultTitle = "DV8 Game Expo <span>2023</span>";
|
||||
let prevTitle;
|
||||
const spacing = 48; // The amount of pixels to offset the section by
|
||||
let prevElement = null;
|
||||
|
||||
window.onscroll = () => {
|
||||
scrollFunction();
|
||||
|
@ -26,13 +27,13 @@ function checkSection() {
|
|||
let sections = document.querySelectorAll("section");
|
||||
|
||||
// If we're at the top of the page, set the title to the default
|
||||
if (window.pageYOffset < sections[0].offsetTop) {
|
||||
if ((window.pageYOffset + spacing) < sections[0].offsetTop) {
|
||||
// If we're already on the default title, don't do anything as it'll break the animation
|
||||
if (prevTitle === defaultTitle) return;
|
||||
if (prevElement === null) return;
|
||||
|
||||
navTitle.innerHTML = defaultTitle;
|
||||
navTitle.style.animation = "title-change 0.2s ease-in-out";
|
||||
prevTitle = defaultTitle;
|
||||
prevElement = null;
|
||||
|
||||
// Remove the animation after it's done, so we can animate again
|
||||
setTimeout(() => { navTitle.style.animation = ""; }, 200);
|
||||
|
@ -48,13 +49,13 @@ function checkSection() {
|
|||
// If the section is on the screen is:
|
||||
// 1. The top of the section is above the top of the screen
|
||||
// 2. The bottom of the section is below the bottom of the screen
|
||||
if (window.pageYOffset >= top && window.pageYOffset < bottom) {
|
||||
if ((window.pageYOffset + spacing) >= top && window.pageYOffset < (bottom - spacing)) {
|
||||
// If we're already on the section, don't do anything as it'll break the animation
|
||||
if (prevTitle === section.id) return;
|
||||
if (prevElement === section) return;
|
||||
|
||||
navTitle.innerHTML = section.id;
|
||||
navTitle.style.animation = "title-change 0.2s ease-in-out";
|
||||
prevTitle = section.id;
|
||||
prevElement = section;
|
||||
|
||||
// Remove the animation after it's done, so we can animate again
|
||||
setTimeout(() => { navTitle.style.animation = ""; }, 200);
|
||||
|
|
Loading…
Add table
Reference in a new issue