- es.davy.ai/
- Programación /
- He creado un con display:block y onmouseover(), pero no puedo hacer clic en él porque en cuanto alejo el mouse desaparece debido a onmouseout().
He creado un
con display:block y onmouseover(), pero no puedo hacer clic en él porque en cuanto alejo el mouse desaparece debido a onmouseout().Entonces hice un
<
div> que se muestra cuando el ratón se coloca sobre un determinado , y se oculta cuando el cursor se aleja.
Un div que he creado que se muestra solo cuando el ratón se coloca sobre un determinado enlace
el div tiene un display: none cuando el ratón se aleja del enlace
este es el código que he utilizado
HTML:
<a href="#" onmouseover="LoginShow()" onmouseout="LoginHide()">Iniciar sesión/Registrarse</a>
JavaScript:
function LoginShow (){ document.getElementById("log").style.display="block";} function LoginHide(){ document.getElementById("log").style.display="none";}
Pero no puedo hacer clic en el div porque tan pronto como intento mover el cursor a los botones en el div, el div desaparece y se oculta ya que debo alejar el cursor del enlace.
Soy nuevo en JS, pero he visto otras páginas web hacerlo, ¿cuál es la forma de hacer que el div se muestre al pasar el mouse sobre él y se pueda hacer clic y se oculte solo cuando me alejo del div?
También he intentado
<a href="#" onmouseover="LoginShow()">Iniciar sesión/Registrarse</a> <div class="login" id="log" onmouseover="LoginShow()" onmouseout="LoginHide()">
Esto soluciona en parte el problema, pero para que el div desaparezca tengo que alejar el cursor del div, si alejo el cursor de la etiqueta de anclaje, no desaparece.
Answer
Comments are closed.
davy.ai
Para que el div se muestre al pasar el ratón por encima y sea clickeable, y desaparezca solo cuando el cursor se aleje tanto del enlace como del propio div, puedes usar los eventos
onmouseenter
yonmouseleave
en lugar deonmouseover
yonmouseout
.Aquí tienes un fragmento de código actualizado que debería funcionar como se desea:
HTML:
JavaScript:
Ten en cuenta que deberás ajustar tu CSS adecuadamente para asegurarte de que el formulario de login se muestre por encima de otros contenidos en la página, si es necesario.