http://www.comolohago.cl/2009/10/19/como-anadir-tooltips-a-tu-web/ Si se puede, te lo enseñamos Fri, 10 Feb 2012 06:50:24 +0000 http://wordpress.org/?v=2.9.2 hourly 1 http://www.comolohago.cl/2009/10/19/como-anadir-tooltips-a-tu-web/comment-page-1/#comment-31112 septiembre impresores Thu, 20 May 2010 16:43:11 +0000 http://www.comolohago.cl/?p=2286#comment-31112 hola muy buen sitio me sirvió mucho tu nota acerca del favicon de hay cree el mio muchas gracias. hola muy buen sitio me sirvió mucho tu nota acerca del favicon de hay cree el mio muchas gracias.

]]> http://www.comolohago.cl/2009/10/19/como-anadir-tooltips-a-tu-web/comment-page-1/#comment-30399 facundo Sat, 08 May 2010 15:04:13 +0000 http://www.comolohago.cl/?p=2286#comment-30399 Hola, me ayudás? no me sale. Copié todo tal cuál está perooo.. naada Hola, me ayudás? no me sale. Copié todo tal cuál está perooo.. naada

]]> http://www.comolohago.cl/2009/10/19/como-anadir-tooltips-a-tu-web/comment-page-1/#comment-28122 Juan Salmerón Wed, 03 Mar 2010 12:48:39 +0000 http://www.comolohago.cl/?p=2286#comment-28122 Hola a todos. A ver quién puede ayudarme. Soy un traductor que e-dita sus traducciones en la página antes mencionada, y uso tooltips para lo que, en edición en papel, serían las notas a pie de página: se pasa el ratón por la llamada y aparece el elemento con la explicación correspondiente. Pero la cosa tiene varias limitaciones, a las que quisiera poner remedio con vuestra ayuda. Para empezar, el tooltip aparece siempre en la misma posición, por lo que, a veces, desaparece por los bordes de la ventana, y solo es posible leer su contenido desplazándose con las flechas (se activan las scrollbars, creo que se llaman). Sin embargo, sé que hay tooltips que modifican su posición para ser siempre visibles íntegramente en la pantalla. Otro problema, este más serio, es que el tooltip desaparece en cuando muevo el ratón de la llamada, y por tanto no puedo "entrar" con este dentro del tooltip, lo que sería muy aconsejable para poder incluir, por ejemplo, enlaces en los que pinchar. Aquí os dejo el código y el body del tooltip: En código: a.info {  position:relative;  z-index:24;  color:#000;  text-decoration:none; } a.info:hover {  z-index:25; } a.info span {     display: none; } a.info:hover span {  display:block;  position:absolute;  top:2em;  left: 0cm;  border:1px solid #000000;  background-color:#FFFFFF;  color:#000000;  text-align:justify;  font-family: Times;  font-size: 14px;  padding: 10px; } En body:  <a href="#" class="info" onclick="return false">°<span style="width:220px">Texto del tooltip.</span></a> Como veis, la anchura no la defino en el código, sino en el <span style> del body, para ajustar en cada caso el tamaño de la nota. En fin, ¿qué me decís? Hola a todos. A ver quién puede ayudarme. Soy un traductor que e-dita sus traducciones en la página antes mencionada, y uso tooltips para lo que, en edición en papel, serían las notas a pie de página: se pasa el ratón por la llamada y aparece el elemento con la explicación correspondiente. Pero la cosa tiene varias limitaciones, a las que quisiera poner remedio con vuestra ayuda. Para empezar, el tooltip aparece siempre en la misma posición, por lo que, a veces, desaparece por los bordes de la ventana, y solo es posible leer su contenido desplazándose con las flechas (se activan las scrollbars, creo que se llaman). Sin embargo, sé que hay tooltips que modifican su posición para ser siempre visibles íntegramente en la pantalla.
Otro problema, este más serio, es que el tooltip desaparece en cuando muevo el ratón de la llamada, y por tanto no puedo “entrar” con este dentro del tooltip, lo que sería muy aconsejable para poder incluir, por ejemplo, enlaces en los que pinchar.
Aquí os dejo el código y el body del tooltip:
En código:
a.info {
 position:relative;
 z-index:24;
 color:#000;
 text-decoration:none;
}
a.info:hover {
 z-index:25;
}
a.info span {
    display: none;
}
a.info:hover span {
 display:block;
 position:absolute;
 top:2em;
 left: 0cm;
 border:1px solid #000000;
 background-color:#FFFFFF;
 color:#000000;
 text-align:justify;
 font-family: Times;
 font-size: 14px;
 padding: 10px;
}
En body:
 <a href=”#” class=”info” onclick=”return false”>°<span style=”width:220px”>Texto del tooltip.</span></a>
Como veis, la anchura no la defino en el código, sino en el <span style> del body, para ajustar en cada caso el tamaño de la nota.
En fin, ¿qué me decís?

]]>