generated from finsweet/developer-starter
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
61422a5
commit 6ba689f
Showing
5 changed files
with
120 additions
and
9 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| // Navigation | ||
| // Hide Nav on Scroll | ||
| document.addEventListener('DOMContentLoaded', function () { | ||
| let lastScrollTop = 0; | ||
| const navbar = document.querySelector('.nav--bar'); | ||
| const scrollThreshold = 50; // Minimum scroll amount before hiding/showing | ||
| const mobileBreakpoint = 768; // Adjust this based on your mobile breakpoint | ||
|
|
||
| function handleScroll() { | ||
| // Only run on desktop | ||
| if (window.innerWidth <= mobileBreakpoint) return; | ||
|
|
||
| const currentScroll = window.pageYOffset || document.documentElement.scrollTop; | ||
|
|
||
| // Check if user has scrolled more than threshold | ||
| if (Math.abs(lastScrollTop - currentScroll) <= scrollThreshold) return; | ||
|
|
||
| // Scrolling down & not at the top | ||
| if (currentScroll > lastScrollTop && currentScroll > 50) { | ||
| navbar.style.transform = 'translateY(-200%)'; | ||
| } | ||
| // Scrolling up | ||
| else { | ||
| navbar.style.transform = 'translateY(0)'; | ||
| } | ||
|
|
||
| lastScrollTop = currentScroll; | ||
| } | ||
|
|
||
| // Add smooth transition to the navbar | ||
| navbar.style.transition = 'transform 0.3s ease-in-out'; | ||
|
|
||
| // Add scroll event listener | ||
| window.addEventListener('scroll', handleScroll, { passive: true }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| // Change Page Title on Leave | ||
| const documentTitleStore = document.title; | ||
| const documentTitleOnBlur = '🚢 Mis de boot niet'; | ||
|
|
||
| // Set original title if user is on the site | ||
| window.addEventListener('focus', () => { | ||
| document.title = documentTitleStore; | ||
| }); | ||
|
|
||
| // If user leaves tab, set the alternative title | ||
| window.addEventListener('blur', () => { | ||
| document.title = documentTitleOnBlur; | ||
| }); |