Very nice looking, Lightbox Gallery Picbox(jQuery)
Images automatically resize to fit the screen when opened. They can then be zoomed in/out using the scroll wheel and moved around on screen using the mouse. Double clicking resets the image or views it full size.
Picbox includes an api and customisation options. Refer to picbox.js in the src/ folder for the full list, including descriptions.
Copy the js/ and css/ folders your server. Then insert the following code into your <head>:
for jQuery, then
The folder structure can be changed, but if you put the images in a different folder to the css file be sure to change the paths in picbox.css!
For easy migration from Lightbox/Slimbox, by default the script activated for links with rel=”lightbox” e.g.
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
To organise the images into groups add a group name after the word “lightbox”
<a href="images/image-1.jpg" rel="lightbox-group1">image #1</a> <a href="images/image-2.jpg" rel="lightbox-group1">image #2</a> <a href="images/image-3.jpg" rel="lightbox-group1">image #3</a>
Of course this can all be customised by editing the autoload code in picbox.js. Example loading code for loading all image links or picasaweb/flickr galleries are in the extras/ folder (all copied from the Slimbox release).
You might also like
accordion accordion menu animation navigation animation navigation menu buttons carousel checkbox inputs css3 css3 menu css3 navigation date picker dialog drag drop drop down menu drop down navigation menu elastic navigation form gallery glide navigation horizontal navigation menu hover effect image gallery image hover image lightbox image scroller image slideshow multi-level navigation menus rating select dependent select list slide image slider menu stylish form table tabs text effect text scroller tooltips tree menu vertical navigation menu