Estoy trabajando en un problema en el que no soy capaz de encontrar una solución. Aunque todavía soy un principiante. Aquí el código:

 var navContact = document.getElementsByClassName("nav-l")[0]; var contactForm = document.getElementsByClassName("kontakt")[0]; var navContactMouseEnter = function (e) { console.log("mouse entered!"); navContact.style.paddingLeft = "5vw"; contactForm.style.transform = "translateX(-25vw)"; } var navContactMouseLeave = function (e) { console.log("mouse left!"); navContact.style.paddingLeft = "0vw"; contactForm.style.transform = "translateX(-31vw)"; } navContact.addEventListener("mouseenter", navContactMouseEnter, true); navContact.addEventListener("mouseleave", navContactMouseLeave, true); navContact.addEventListener("click", (e) => { e.preventDefault(); navContact.removeEventListener("mouseleave", navContactMouseLeave, true); navContact.style.paddingLeft = "5vw"; contactForm.style.transform = "translateX(0vw)"; });

Estoy tratando de obtener una pequeña animación de deslizamiento en "mouseenter", pero al "hacer clic", ese elemento debería deslizarse por completo e ignorar cualquier evento de "mouseleave" . Ahí estoy enfrentando los problemas... No puedo cancelar el evento "mouseleave". Ese elemento solo debería desaparecer cuando hago clic en "X", pero eso no es problema.

Estoy agradecido por cualquier ayuda.

¡Gracias por adelantado!