Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] Perfeccionar funcionamiento

Estas en el tema de Perfeccionar funcionamiento en el foro de Javascript en Foros del Web. Buenas, tengo un formulario al que yo mismo le he construido unos tooltips que se posicionan en el raton. Esto funciona bien, pero el problema ...
  #1 (permalink)  
Antiguo 07/05/2015, 04:08
 
Fecha de Ingreso: febrero-2015
Mensajes: 9
Antigüedad: 4 años, 7 meses
Puntos: 0
Perfeccionar funcionamiento

Buenas, tengo un formulario al que yo mismo le he construido unos tooltips que se posicionan en el raton. Esto funciona bien, pero el problema es que cada vez que sale el tooltip y mueves el raton encima del mismo, se borra y vuelve a salir, lo cual provoca unos espasmos un tanto molestos, no se si habra alguna solución. Os dejo el código, y comentar que están posicionados en absolute. Gracias de antemano
Código HTML:
<!DOCTYPE HTML>
<html lang="es">
<head>
<title>Formulariohtml_proyectoguiado</title>
<meta charset=utf-8>
<link rel="stylesheet" type="text/css" href="resources/estilos.css"/>
<script language="javascript" type="text/javascript">
function capturaMOUSE(event) 
{ 
  return { 
                    x:(window.event)?(window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft):(event.clientX + (window.scrollX || document.body.scrollLeft || 0)), 
                    y:(window.event)?(window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop):(event.clientY + (window.scrollY || document.body.scrollTop ||0)) 
                }; 
}
function muestra(id){
var posMOUSE=capturaMOUSE(arguments[4] || window.event);
var ex=document.getElementById(id);
ex.style.top=posMOUSE.y + "px";
ex.style.left=posMOUSE.x + "px";
if(ex.style.display=='block' or ){
	ex.style.display='none';
	} else{
	ex.style.display='block';
	}
}
</script>
</head>
<body onmousemove="position(event);">
	<form method="post">
	<label for="campoNombre">Nombre</label><br/>
	<input type="text" id="campoNombre" name="campoNombre" value="" onMouseOver="muestra('exnom')" 
	onMouseOut="muestra('exnom')"/></br>
	<label for="campoApellidos">Apellidos</label><br/>
	<input type="text" id="campoApellidos" name="campoApellidos" value=""onmouseover="muestra('exape')"
	onmouseout="muestra('exape')"/></br>
	<label for="campoDNI">DNI</label><br/>
	<input type="text" id="campoDNI" name="campoDNI" value="" onMouseOver="muestra('exdni')"
	onMouseOut="muestra('exdni')"/></br>
	<label for="campoEdad">Edad</label><br/>
	<input type="text" id="campoEdad" name="campoEdad" value="" onMouseOver="muestra('exedad')"
	onMouseOut="muestra('exedad')"/></br>
	<label for="campoAvatar">Avatar</label><br/>
	<input type="file" id="campoAvatar" name="campoAvatar" onMouseOver="muestra('exav')"
	onMouseOut="muestra('exav')"/></br>
	<label for="campoDomicilio">Domicilio</label><br/>
	<input type="text" id="campoDomicilio" name="campoDomicilio" maxlength="200" onMouseOver="muestra('exdom')"
	onMouseOut="muestra('exdom')"/></br>
	<label for="campoProvincia">Provincia</label><br/>
	<input list="provincias" type="text" id="campoProvincia" name="campoProvincia" value="" onMouseOver="muestra('exprov')"
	onMouseOut="muestra('exprov')"/></br>
	<label for="campoTelefono">Telefóno</label><br/>
	<input type="text" id="campoTelefono" name="campoTelefono" value=""onMouseOver="muestra('extef')"
	onMouseOut="muestra('extef')"/></br>
	<label for="campoMail">Mail</label><br/>
	<input type="text" id="campoMail" name="campoMail" value="" onMouseOver="muestra('exem')"
	onMouseOut="muestra('exem')"/></br>
	<label for="campoPassword">Contraseña</label><br/>
	<input type="password" id="campoPassword" name="campoPassword" value="" onMouseOver="muestra('expass')"
	onMouseOut="muestra('expass')"/></br>
	<label for="campoComprobarPassword">Comprobación de Contraseña</label><br/>
	<input type="password" id="campoComprobarPassword" name="campoComprobarPassword" value="" onMouseOver="muestra('excpass')"
	onMouseOut="muestra('excpass')"/></br></br>
	<input type="submit" value="Validar"/>
	</form>
</div>
	<div id="exnom" style="display:none;">El campo Nombre es obligatorio.</div>
	<div id="exape" style="display:none;">El campo Apellidos es obligatorio.</div>
	<div id="exdni" style="display:none;">El campo DNI es obligatorio. Debe contener 9 cáracteres, 
	8 números y una letra.</div>
	<div id="exedad" style="display:none;">Este campo no es obligatorio. Deebe ser un valor numérico y estar 
	comprendido entre 1 y 120.</div>
	<div id="exav" style="display:none;">Este campo no es obligatorio. Sera la imagen que te representará.</div>
	<div id="exdom" style="display:none;">Este campo no es obligatorio. Máxima longitud: 200 carácteres.</div>
	<div id="exprov" style="display:none;">Este campo no es obligatorio. Debe pertenecer a una de las listadas.</div>
	<div id="extef" style="display:none;">Este campo no es obligatorio. Deebe ser un numero válido: 9XXXXXXXX ó 6XXXXXXXX.</div>
	<div id="exem" style="display:none;">Este campo es obligatorio. Débe ser un email válido.</div>
	<div id="expass" style="display:none;">Este campo es obligatorio. Se indica la fortaleza de tu contraseña, pero no hay requisitos.</div>
	<div id="excpass" style="display:none;">Este campo es obligatorio. Repite la contraseña antes escrita, por favor.</div> 
Esta sin terminar, proque el resto son listas y cosas que no tienen importancia.
  #2 (permalink)  
Antiguo 07/05/2015, 04:57
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 11 años, 4 meses
Puntos: 1011
Respuesta: Perfeccionar funcionamiento

la manera correcta de hacerlo es con css
http://www.forosdelweb.com/f4/ejempl...9/#post4193733
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}

Etiquetas: formularios, posicion, tooltip
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:09.