mouseover mouseout Jquery problema

Rapa · #1 (**permalink**) 31/05/2013, 14:32

Buenas, os explico el problema que tengo haber si podéis solucionármelo.

Estoy intentando mostrar un div al pasar el ratón por encima, con la intención de poner unos enlaces en el, y que se oculte al sacar el ratón, no tengo muchos conocimientos de javascript, he conseguido que funcione pero, no paraba de abrirse y cerrarse.

Os dejo aquí el código haber si podéis ayudarme:

Este no es el que menciono anteriormente, es lo que creo que debo hacer para que no ocurrar ese error , pero las funciones de javascript estan mal y no se por qué.

.

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<
<title>drfgdf</title>
  <script type="text/javascript" src="jquery-1.10.1.min.js"></script>    
</head>
<style>
.slideTogglebox{
		position:absolute;
	background-color: black;
	opacity: ;
	filter: alpha(opacity=50);
	-moz-opacity: .5;

 width:20%;
 height:60px;
 margin-left:40%;

top:0;
z-index:1;}
	

.QuickC{ visibility:hidden;	position:absolute;
	background-color: red;
	opacity: ;
	filter: alpha(opacity=50);
	-moz-opacity: .5;

 width:20%;
 height:60px;
 margin-left:40%;

top:0;
z-index:1;}

</style>


script type="text/javascript">


 $("#QuickC").mouseover(
						function(){ $('.slideTogglebox').slideDown('fast');)}
  
 $("#slideTogglebox").mouseout(
						function(){ $('.slideTogglebox').slideUp('fast');)}
 
	 			


</script>
<body>

<div class="QuickC"></div>
<div class="slideTogglebox"></div>

</body>
</HTML>

chicho_2667 · #2 (**permalink**) 31/05/2013, 16:49

Tal vez te pueda servir de esta manera, este es un poco dinamico, el div en tu caso seria "QuickC"

//consulta de novedad: Cuando se pasa por encima del icono
$('.icono').die("mouseover");
$('.icono').live("mouseover",function (){
div=$(this).children("div").attr("id");
if($("#"+div).is(":hidden")){
$("#"+div).css({
display:'block'
});
}
});

//consulta de novedad: Cuando sale de la zona del icono
$('.icono').die("mouseout");
$('.icono').live("mouseout",function (){
div=$(this).children("div").attr("id");
if(!$("#"+div).is(":hidden")){
$("#"+div).css({
display:'none'
});
}
});

Rapa · #3 (**permalink**) 31/05/2013, 19:51

muchas gracias

Aeon1 · #4 (**permalink**) 12/06/2013, 12:02

puedes probar cambiando tu mouseover y mouseout por mouseenter y mouseleave