He intentado muchas formas de simplemente hacer que una clase cambie en una imagen cuando paso el mouse sobre un elemento del menú y me está volviendo loco. Si alguien puede ayudarme a aclarar esto, agradecería un poco de ayuda... Al final tendré tres de estos en su lugar, uno para rojo, amarillo y azul... esto es lo que tengo como ejemplo...
<script>
const triggerRed = document.getElementsByClassName('gardenBtn');
const redIMG = document.getElementById('gardenMe');
// 👇️ Change
triggerRed.addEventListener('mouseover', function handleMouseOver() {
list = redIMG.classList;
list.remove('risoMe');
});
// 👇️ Change back
triggerRed.addEventListener('mouseout', function handleMouseOut() {
list = redIMG.classList;
list.add('risoMe');
});
</script>
pero nada cambia
No veo en ninguna parte que declares variable de list . De todos modos, si desea agregar una clase a ese elemento:
list.classList.add('class-name');
si desea eliminar una clase:
list.classList.remove('class-name');