Edit header bar animation

This commit is contained in:
Paul Nicoué 2022-06-02 15:22:19 +02:00
parent a021b6443a
commit 87ff1e0772
6 changed files with 55 additions and 56 deletions

View file

@ -4,17 +4,13 @@
// DATA
// ----------------------------------------------------------------------------
// Get HTML root element
const root = document.documentElement;
// HOME NAVIGATION DISPLAY //
// Get navigation HTML elements
const navEl = document.querySelector('.home__nav');
const navLinks = document.querySelectorAll('.home__nav-link');
const navImage = document.querySelector('.home__nav-image');
// Declare empty circleTypes array for further use
const circleTypes = [];
// VIDEO PLAYERS //
@ -226,12 +222,13 @@ function toggleVideosFullScreen() {
// HEADER BAR ANIMATION //
// Toggle header bar depending on scroll
function toggleHeaderBar() {
if (headerBar) {
let headerBarHeight = headerBar.getBoundingClientRect().height;
if (window.pageYOffset > headerBarHeight) { // Scroll down past header bar height
headerBar.classList.add('header-bar--fixed');
} else {
} else if (window.pageYOffset <= 0) {
headerBar.classList.remove('header-bar--fixed');
headerBar.classList.remove('header-bar--visible');
}