Ver Mensaje Individual
  #6 (permalink)  
Antiguo 22/06/2010, 18:38
Dany_s
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 14 años, 4 meses
Puntos: 65
Respuesta: Evitar que se repita evento hover jquery

Cita:
Iniciado por Banditolane Ver Mensaje

Código:
$('#opcion_password').hover( function() {
	
	$('#hint_menu_superior').stop(true).html('Te ayudamos a recuperar tu password');
	$('#hint_menu_superior').stop(true).slideDown();

},function() {
	
	$('#hint_menu_superior').empty();
	$('#hint_menu_superior').stop(true).slideUp();

});
El problema que tienes ahí es que que al hacer el mouseout cuando el slide está al 50% va a quedar con una altura del 50% por el stop y al volver a entrar va a quedar cortado.

Hice uno usando animate modificando el alto y para que cuando hagan mouseout y esté por la mitad se cierre desde ese lugar y no tenga que terminar :), tiene un delay para que no se muestre si se pasa el cursor rapidamente al estar navegando.

Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>

$( function (){
    $('#opcion_password').hover( function (){
        $("#hint_menu_superior").delay(500).animate({height:'100px'}, 1000);
    },
    function (){
        $("#hint_menu_superior").stop(true).animate({height:'0px'}, 1000);
    });
});
</script>
    <style>
        #hint_menu_superior{height:0px; width:250px; background:red; overflow:hidden }
    </style>
  </head>
<body>
<a href="#" class="opcion_menu_superior" id="opcion_password">&iquest;Olvidaste tu password?</a>
<div id="hint_menu_superior">Te ayudamos a recuperar tu password</div>
</body>
</html> 
el método delay está disponible desde jquery 1.4 si usan una versión anterior se puede usar un animate con algo que no se modifica como opacidad al 100% jeje

Última edición por Dany_s; 22/06/2010 a las 18:46