ayuda css o js?

[sergio87]

en la web
http://psdcreativo.com/

cuando te situas encima de de cada texto con link se despliega un recuadro rojo en este caso con información llamado "tiptitle" pero no se como funciona y tampoco le puedo dar efecto con css tal como se ve en la web que les acabo de pasar.

si me pueden ayudar, se los agradecería.

saludos gente!

[kseso?]

Hola Sergio
Creo que ese tooltip lo administra con:

Código html:

<script language="JavaScript" src="http://psdcreativo.com/wp-content/themes/InterPhase/qTip.js" type="text/JavaScript"></script>
 

Pero siempre tienes la sencilla solución de utilizar en tus enlaces el 'title'

<a href="#" title="lo que quieres que se muestre">....</a>

Otra forma sería utilizando un span oculto y mostrarlo al "a:hover span". En www.araudi.net tienes algún ejemplo.

Un saludo

[sergio87]

gracias, lo investigaré.

lo del 'title simple' ya lo sabia igual, pero queria hacer algo mas elaborado como puse en el ejemplo.

saludos

[Mikmoro]

Iniciado por sergio87

lo del 'title simple' ya lo sabia igual, pero queria hacer algo mas elaborado como puse en el ejemplo.

Claro, por eso este enlace

[jomaruro]

Hola:

Y tienes este otro enlace que también te puede valer.

Saludos.

[GagleKas]

Lo pudes hacer con javascript.

Creas la etiqueta y la pones, por ejemplo, dentro del tag body en la primera posicion o donde mas te guste. Puedes utilizar un div. Tambien le pones un ID y la ocultas con display: none.

Luego en el texto que quieras que tenga esa etiqueta le añades los atributos onmousemove (para que se mueva cuando pases por encima) y onmouseout para ocultarla cuando saques el cursor.

La funcion que oculta la capa es facil, tan solo tienes que poner miEtiqueta.style.display = "none";

En la funcion que se llama al mover el cursor, primero le pones miEtiqueta.style.display = "inline";. Luego tienes que configurar la distancia entre el cursor y la etiqueta. Esto lo haces con el objeto Event que tienes que pasarle a esta funcion. Por ejemplo:

miEtiqyeta.style.left = e.clientX + 15 + "px";
miEtiqueta.style.top = e.clientY + 10 + "px";


Espero haberte ayudado.