Efecto, se amplia imagen al dar click en ella (SOLUCIONADO)

[locmasm]

Que tal, espero me puedan ayudar.

Ando buscando como lograr este efecto: http://markrock.net/sitio/index.php?...c=detail&id=14 (den click sobre la imagen)

¿Ven lo que sucede?

Se abre una sub-ventana o ventana interna que se amplia acorde al tamaño de la imagen.

¿Cómo puedo lograr eso?

De antemano, gracias.

Edición:

Aca otro ejemplo del efecto: http://www.elcircodelrock.com/evento...-streetconcert

Solución:

Bueno soy demasiado impaciente y eso me llevo a encontrar como hacerlo, la herramienta gratuita ThickBox: http://jquery.com/demo/thickbox/

Es muy simple, aquí les dejo una guía rápida:

1. Copien: http://jquery.com/demo/thickbox/thic...de/thickbox.js y guardenlo en css/thickbox.js

2. Copien: http://jquery.com/demo/thickbox/thic...e/thickbox.css y guardenlo en css/thickbox.css

3. Guarden esta imagen: http://jquery.com/demo/thickbox/imag...gAnimation.gif en images/loadingAnimation.gif

4. Copien: http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js y guardenlo en css/jquery.js

5. Entre las etiquetas body peguen esto:

Código PHP:

  <script type="text/javascript" src="path-to-file/jquery.js"></script>
<script type="text/javascript" src="path-to-file/thickbox.js"></script> 
  

6. Entre las etiquetas body, abajo del punto 5 peguen esto:

Código PHP:

  <link rel="stylesheet" href="path-to-file/thickbox.css" type="text/css" media="screen" /> 
   

7. En donde quieran mostrar la imagen usan:

Código PHP:

  <a href="images/single.jpg" title="add a caption to title attribute / or leave blank" class="thickbox"><img src="images/single_t.jpg" alt="Single Image"/></a> 
   

Claro modificando las rutas de las imagenes, en title pueden añadir texto que aparecerá al abrir la imagen.

Y es todo, si quieren más info: http://jquery.com/demo/thickbox/

Saludos