JAVASCRIPT TOGGLE
Links
//TOGGLE WINES
document.querySelector('#btnCarrito')
.addEventListener( 'click', (e)=> {
//hace q el elemento html al que accede, deshabilita comportamiento
e.preventDefault();
document.querySelector('.carrito').classList.toggle('js_verCarrito');
document.querySelector('body').classList.toggle('carritoAbierto');
document.querySelector('.page__header').classList.remove('headroom--top');
drawer.close();
})
//TOGGLE MARATON
//usar variables para acceder a distintos elementos
var btnMenu = document.getElementById('btnMenu'),
elMenu = document.querySelector('.main_menu'), //esperamos encontrar 1, si hay mas de uno tomaría el primero (con querySelectorAll se podría aplicar)
elementosMenu = document.querySelectorAll('.main_menu-link');
btnMenu.addEventListener('click', function(){
console.log('Has pulsado el botónnnnnn');
elMenu.classList.toggle('verMenu'); //con toggle hace que cambie
this.classList.toggle('btnX'); // se le añade una clase btnX
});
elementosMenu.forEach((elementoMenu)=>{
elementoMenu.addEventListener('click', () =>{
elMenu.classList.remove('verMenu'); //Se elimina el menu visible
btnMenu.classList.remove('btnX'); //se quita el boton de X de menu
});
});