Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/09/2009, 07:57
Carlillus
 
Fecha de Ingreso: junio-2007
Ubicación: Sabadell, BCN
Mensajes: 95
Antigüedad: 17 años, 7 meses
Puntos: 1
[Resuelto] Problema al ocultar SPAN's con JavaScript

Hola, he creado un script que hace que cada vez que se pasa el cursor por encima de el nombre de cualquier usuario, se muestre una ventanita pequeña con un resumen de su perfil mas o menos encima del nombre. A la hora de mostrarlo todo va perfectamente, pero a la hora de ocultarlo me da muchos problemas.

Este es el script que he usado:

Código HTML:
<script>
	function show_mini_profile(number){
		profile = document.getElementById("mini_profile_" + number)
		profile.style.display = 'block'
	}
	function hide_mini_profile(number){
		profile = document.getElementById("mini_profile_" + number)
		profile.style.display = 'none'
	}
</script>

...

<SPAN STYLE="position:relative;"><a href="profile.php?user='.$user.'" class="index_user_link" onmouseover="show_mini_profile('.$rand_show.')">'.$user.'</a><SPAN id="mini_profile_'.$rand_show.'" class="cell_profile" style="background: url(images/interface/index/mini_profile_bg.png); background-color:#333333;" onmouseout="hide_mini_profile('.$rand_show.')">
<table width="200" cellspacing="0" cellpadding="0">
	<tr>
		<td class="cell_profile_text" width="64"><img alt="'.$user.'" src="avatars/'.$player['avatar'].'" border="0" /></td>
		<td class="cell_profile_text" valign="top"><b>'.$user.'</b>
		</td>
		<td class="cell_profile_text" width="12" valign="top"><img src="images/interface/index/mini_profile_close.png" border="0" onclick="hide_mini_profile('.$rand_show.')"></td>
	</tr>
</table>
</SPAN></SPAN> 
Y la parte CSS:

Código HTML:
.cell_profile{
	position:absolute; 
	top:0px; 
	left:0px; 
	width: 200; 
	border: solid 1px #000000; 
	z-index: 5; 
	font-weight: 100; 
	text-align: left; 
	color: #FFFFFF; 
	display: none;
}
.cell_profile_text{
	font-weight: 100;
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	text-align: left; 
	color: #FFFFFF; 
}
Como podeis ver dentro de esta ventanita, hay una tabla con 3 columnas y la funcion "onmouseout" fuera de la tabla. Pero el problema es que cuando el cursor se sale de la primera columna de la tabla o del texto de alguna de las otras, la ventanita se cierra. Me gustaría que solamente se cerrara cuando el cursor se sale completamente de la ventanita.

Cual es el problema?

Gracias

Última edición por Carlillus; 24/09/2009 a las 12:39 Razón: Tema Resuelto