Torchbox Image Lightbox
A New Take on Lightboxes
We wanted to create a lightbox that performs a few things:
A LIGHTBOX THAT DOES ITS JOB: SHOW HIGH RESOLUTION IMAGES
What we disliked about lightboxes is that when you click on an image, you’re given a loading icon and you are forced to wait until the high resolution image loads before you can see anything. Torchbox gives you the low resolution copy of the image as a preview, while the high resolution one is being loaded. When it’s ready, the low resolution switches into the high resolution image seamlessly. What you have here is an uninterrupted image viewing experience.
AUTODETECTS HIGH RESOLUTION IMAGES
With the competition, you will usually have to edit your existing images, or change the way you input images in your content. And in some cases, sometimes the lightbox works and sometimes it doesn’t. With Torchbox, we study the images you place in your content and gather the high resolution counterparts ourselves to ensure that your visitors can view them properly. Not only that, we also adjust to serve high resolution images that are just the right size to save on bandwidth.
UNIQUE LIGHTBOX DESIGN
Most lightboxes are the same, click on an image, then a box opens with a loading icon. Torchbox changes things a bit. When you click an image, it pops out of its place then grows into the lightbox. And when you close the lightbox, the image then snaps back into place. It’s a simple effect, but very effective in blending into your site’s design.
MAKE THE IMAGE IN THE LIGHTBOX THE STAR OF THE SHOW
We feel that a minimalist design is more suitable for a lightbox. The lightbox isn’t the star of the show, your image is. We’ve designed our lightbox to display captions and navigation buttons in a non-obtrusive, yet stylish way.
Speaking of high performance, we use true hardware acceleration. We have carefully crafted our styles and animations so that we only use rules and transforms that use the least amount of browser repaints. This results in almost no lagging, no pauses during transitions and animations.
Full Feature Set
- A unique design and seamless lightbox experience;
- Automatically converts images into lightboxes;
- Automatically detects high resolution versions of your images;
- Lightboxes WordPress galleries;
- Detects captions and hides them when the lightbox is closed;
- Detects the image size and serves a high resolution version of the same size (you can optionally install the OTF Regenerate Thumbnails plugin to help you here);
- High resolution with preview, when the lightbox opens, it shows your low resolution image. The high resolution version preloads and gets shown when ready;
- Left and right lightbox arrow navigation;
- Left and right lightbox keyboard navigation;
- Configurable colors;
- Different behavior in mobile devices: high resolution images open instead of a lightbox;
- Compatible with Visual Composer’s Single Image Element;
- Hardware accelerated transitions and animations;
- Compatible with Jetpack’s Photon CDN module;
- Lots of options for changing the default behavior:
- Apply Torchbox to ALL content images
- Apply Torchbox to a provided selector
- Controllable high resolution max size to save bandwidth
- Disable lightbox navigation
- And more…