Plugins y técnicas jQuery para crear efectos con imágenes

[Alun]

Hola de nuevo, Jesús:

Ya se qué plugin es ese, estoy ahora mismo trabajando con uno igual, Fancybox, no se si lo conocerás.

Lo que yo hago es generar las etiquetas IMG mediante PHP, añadiéndole un ID, por supuesto, pero además, agregándole una clase igual a todas las fotos, quedándome algo así:

Código HTML:

<a class="galery" href="images/image1.jpg"><img src="images/thumbs/image1.jpg" id="image1"></a>
 <a class="galery" href="images/image2.jpg"><img src="images/thumbs/image2.jpg" id="image2"></a>
 

Luego lo tienes más fácil para aplicarles el efecto jquery, en lugar de aplicar el efecto individualmente a cada link, lo haces con todos de una vez, de esta forma:

Código Javascript:

$("a.galery").click(function(evt){
  evt.preventDefault();
  var src = $(this).attr("href");
  open(src);
 });
 

La idea es simplificarlo, no tienes por qué aplicarle la misma función individualmente a cada una de las 149 imágenes con sus respectivos links, sino aplicársela a una clase, así, puedes añadir o eliminar fotos sin tener que tocar el código, ya que lo aplicará al número exacto de imágenes que haya.

El php para generar las imágenes es algo así:

Código PHP:

$path = 'img/images/thumbs';
 $opendir = opendir($path) or die ('No se `ha encontrado el directorio');
 
 while($file = readdir($opendir)){
  /*hay que comprobar que no se tomen los directorios padre, raiz y el
  archivo db si usas windows, o los archivos que tengas y no quieras mostrar*/
  if($file == '.' || $file == '..' || $file == 'Thumbs.db'){continue;}
  /*Por cada imagen contenida en el directorio, haces un echo
  asignándole la misma clase a todas, y de ID el nombre del archivo.
  Igualmente, el ID no es necesario ponerlo, ya que, para simplificar,
  vas a tomar el selector CLASS con jquery.*/
  echo "<a class=\"galery\" href=\"{$path}/{$file}\">
        <img src=\"{$path}/{$file}\" id=\"{$file}\">
        </a>\n";
 }
 

Si quieres un enlace a la web del plugin que uso yo, que, por lo que veo, trabaja igual que el tuyo, es este:

http://fancybox.net/


Espero que esto solucione tu problemilla y te ahorre código. Suerte!!