Estoy tratando de hacer la funcionalidad 'volver al principio'. Sin embargo, funciona bien en el escritorio, pero en el móvil tengo que tocar el botón dos veces para que funcione. ¿Cómo puedo hacer que la funcionalidad funcione en dispositivos móviles con un solo clic/toque? Muchas gracias por adelantado.
window.addEventListener("scroll", function () { if (window.scrollY > 150) { backToTop.classList.remove("invisible"); backToTop.addEventListener("click", function () { document.documentElement.scrollTop = 0; }); } else { backToTop.classList.add("invisible"); } }); <!-- Back To Top --> <a id="back-to-top" class="fixed z-40 w-12 h-12 sm:w-14 sm:h-14 2xl:w-16 2xl:h-16 rounded-full flex justify-center bottom-5 right-5 sm:bottom-7 md:bottom-10 xl:bottom-12 xl:right-8 2xl:right-10 2xl:bottom-14 3xl:bottom-20 3xl:right-18 invisible teritary-bg-hover secondary-bg"> <svg class="w-5 sm:w-6 2xl:w-8" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 38.372 21.841"> <path id="Path_11" data-name="Path 11" d="M21.744-3.3l18.924,20.64-1.32,1.2L21.744.008,3.8,18.544l-1.5-1.2h0Z" transform="translate(-2.296 3.297)" fill="current" /> </svg> </a> <!-- /Back To Top -->