Van icon

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
        });
    });