No sé si os habéis fijado, pero cuando pinchas en alguna de mis fotos salta una ventana dentro de la misma página ampliando la imagen clickeada. Este efecto pertenece a una librería y se llama ShadowBox, y aunque sea más conocido el LightBox, este es más completo, pues se puede visualizar casi todo tipo de contenido: flash, páginas web, imágenes...

• La forma de implementarlo es tan simple que al principio no creía que fuese a funcionar. Primero, debes descargar este archivo que incluye los dos necesarios. Recomiendo subirlos a DropBox. Simplemente hay que añadir el código siguiente antes de </head>
  
  VER CÓDIGO
  
  <link href='URL del archivo.css' rel='stylesheet' type='text/css'/><script src='URL del archivo.js' type='text/javascript'/><script type='text/javascript'>Shadowbox.init({overlayColor: "#000",overlayOpacity: &quot;0.6&quot;,});</script> 

La forma de utilizarlo es aún más simple. Solo hay que añadir rel='shadowbox' en el elemento que querramos aplicar el efecto. Esto es:

• Da igual el tipo de archivo que queramos que aparezca en esta ventana emergente, simplemente hay que hacer esto:
  
  <a href='URL-DE-LO-QUE SEA' alt='lo que sea' rel='shadowbox'>Texto o imagen</a>
• Con los vídeos hay que tener más cuidado, por eso se le suele dar un valor de alto y ancho:
  
  rel='shadowbox; width= 400px; height= 340px;
  
  

VÍA | CiudadBlogger