tooltip con imagenes

[gusphil]

buenas gente quiero hacer este tooltip con imágenes i no me sale me muestra las dos imágenes dentro del div como lo hago ?

este e sel código :

Código HTML:

<div id="incognita"><a class="globos"><img src="../imagenes/interrogación.png" width="82" height="91" /><span><img src="../imagenes/tooltip.png"/></span></a></div> 

saludos y gracias !

Y si no cual seria la forma de hacer una imagen de sustitución con dimensiones distintas, ya que la segunda al sr mas grande cuando paso el puntero no me la muestra del tamaño real !

[jomaruro]

Hola:

No sé exactamente lo que quieres hacer, pero léete este artículo: Tooltips usando CSS.

Saludos.

[gusphil]

Lo que quiero es crear un tooltip con una imagen, osea que al pasar el ratón sobre una imagen esta desaparezca y aparezca la otra !

[jomaruro]

Hola:

Entonces lo que debes usar es un sprite css, mira este tema.

Saludos.

[kseso?]

Código CSS:

.incognita a span {display: none;}
.incognita a:hover img {display: none;}
.incognita a:hover span img {display: block;}
 

Añadase el resto de propiedades necesarias para su correcto posicionamiento.

Pero quizás fuese mejor no utilizar un span como contenedor de la segunda imagen. Quizás mejor aplicar una clase a cada una:

Código HTML:

<div id="incognita">
<a class="globos" href="#">
<img class="icono" src="..." width="82" height="91" alt="alt" />
<img class="big" src="..." alt="alt" />
</a>
</div>
 

Y si van a ser más de un enlace con sus imágenes, crear una lista (ul/li/a)

P.D.: acostúmbrese a publicar también el css implicado.