Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JQuery lightbox plugin: Scaling very large images to fit screen

I'm using the jQuery "Lightbox" plugin, although I don't know if that's necessary information about the problem at hand.

The images I'm putting through my slideshow are quite large; each of them is far larger than the screen (I don't host the images on my server so I cannot resize them). I need to scale them to fit within the bounds of the screen (probably with some margin as well). Are there some JQuery or other Javascript snippets out there to take care of this?

Edit

Now I use "zoombox", which certainly fixes the scaling issue. However, now all the nice slideshow features are lost! I.e., I cannot use the arrow keys or cycle through the gallery of images!

like image 384
Bill VB Avatar asked Feb 21 '23 11:02

Bill VB


2 Answers

Here are three plugins which are pretty feature rich and widely used, they should do the job with ease :

http://www.jacklmoore.com/colorbox

http://fancybox.net/

http://www.grafikart.fr/zoombox

Edit: Pretty much every lightbox solution is listed and compared at : http://planetozh.com/projects/lightbox-clones/

like image 64
DaveE Avatar answered Mar 08 '23 23:03

DaveE


I've settled on Floatbox after testing out a dozen of these libraries. The default settings size the image to fit the screen and allow navigation with the arrow keys. Clicking on an image zooms it to 100%. It's easily configurable in terms of colors, window decorations, and the like.

like image 28
Andreas Yankopolus Avatar answered Mar 08 '23 22:03

Andreas Yankopolus