Hola a todos, tengo una duda, estoy haciendo una prueba con las funciones slideDown y slideUp, para mostrar un div sobre una imagen, quiero que al pasar el mouse por mi imagen, se muestre un div sobre esta, y cuando el mouse se quite de la imagen o del div que emergió se guarde de nuevo el div, he logrado que surga el div, y cuando salgo de la imagen se oculta perfecto, pero si me posiciono sobre el div se crea un ciclo, se muestra y oculta el div repetidas veces, que puedo hacer para que se quede quieto el div hasta quitar el mouse de el y la imagen???
mi estructura es la siguiente:
<div onmouseout="hidediv();">
<div id="tool" style="z-index: 1; width:177px; height:60px; position:absolute; z-index:1; background-color:#d8a92d; display:none; bottom:60%">contenido a mostrar</div>
<img src="foto.jpg" onmouseover="showdiv();" id="imagen" />
</div>
y estas son mis funciones:
function showdiv() {
$('#tool).slideDown(function(){});
}
function hidediv() {
$('#tool).fadeOut('slow');
}
Alguien me puede decir como solucionarlo? Mil gracias de antemano