Add lightbox effect to image links using jQuery
Lightboxs are very popular to display large images using model dialogs. It is elegant and easy to implement. Here I have a simple example of how you can use jQuery to find all anchors link to an image and hook it up with a lightbox automatically… by using jQuery, of course!
Current version of jQuery is 1.3.2 and I use PrettyPhoto as my choice of jQuery lightbox plugin.
Use jQuery to find all anchors with links ending with .png, .jpg or .gif:
$("a").filter("[href$=.png], [href$=.jpg], [href$=.gif]").click(function(){...})
Next you hook the lightbox method after the click event, and you done!
Now show off your javascript skills in your blog without having to set each image manually!
Clean Code