Estimados
Tengo un problema que se me presenta en
Firefox 2.0 (En las versiones anteriores no) y tiene que ver con un conflicto entre
onmousemove y
onmouseout.
Mi objetivo es el de hacer un tooltip que al pasar por encima de la foto aparezca un DIV que a su vez mientras se está arriba de la imagen se desplace según las coordenadas del ratón, y en el momento de sacar el mouse de encima de la imagen, ese DIV desaparezca.
El problema es que en
Firefox 2.0 al estar encima de la foto se me produce una intermitencia de ejecución entre onmouseover y onmouseout (esto no sucede cuando onmousemove no esta activado).
Este es el código que tengo:
Código:
<html>
<head>
<title>Tooltip</title>
<style type="text/css">
#label { width: 116px; height: 51px; position: absolute; background: red; text-align: center; padding-top: 10px; visibility: hidden; display: none; font-family: "Trebuchet MS"; font-size: 14px; font-weight: bold; }
</style>
<script type="text/javascript">
var show = false;
document.onmousemove = poslabel;
function poslabel(e){
if(document.all){
document.getElementById('label').style.left = event.x + "px";
document.getElementById('label').style.top = (event.y - 51) + "px";
}else{
document.getElementById('label').style.left = e.clientX + "px";
document.getElementById('label').style.top = e.clientY + "px";
}
}
function muestranombre(nombre,estado){
show = estado;
document.getElementById('label').innerHTML = nombre;
if(show){
document.getElementById('label').style.visibility = "visible";
document.getElementById('label').style.display = "block";
}else{
document.getElementById('label').style.visibility = "hidden";
document.getElementById('label').style.display = "none";
}
}
</script>
</head>
<body>
<div id="label"></div>
<p><img src="image2.gif" width="126" height="250" onMouseOver="muestranombre('LETICIA',true)" onMouseOut="muestranombre('LETICIA',false)" /></p>
</body>
</html>
Desde ya, muchas gracias por vuestra ayuda.
saludos
ricardo