100-project-100-days-website/100_projects/15-netflix-mobile-navigation-animation/app.js
2023-03-08 11:17:02 +03:00
Ask

22 lines
909 B
JavaScript

{30c7710b34210c16c05142e08635103e91c6d6de true 909 app.js 0xc001eacd20}

const netflix_open_btn = document.querySelector('.netflix-open-btn');
const netflix_close_btn = document.querySelector('.netflix-close-btn');
const netflix_nav = document.querySelectorAll('.netflix-nav');
netflix_open_btn.addEventListener('click', () => {
netflix_nav.forEach(nav_el => { nav_el.classList.add('visible') });
});
netflix_close_btn.addEventListener('click', () => {
netflix_nav.forEach(nav_el => { nav_el.classList.remove('visible') });
});
// GET IN TOUCH COMPONENT
const floating_btn = document.querySelector('.floating-btn');
const close_btn = document.querySelector('.close-btn');
const social_panel_container = document.querySelector('.social-panel-container');
floating_btn.addEventListener('click', () => {
social_panel_container.classList.toggle('visible')
});
close_btn.addEventListener('click', () => {
social_panel_container.classList.remove('visible')
});