Saturday, January 06, 2007

Lightbox with always visible Prev and Next Links

The Problem: Lightbox Prev and Next Navigation being visible onMouseOver is not obvious enough

After enabling Lightbox on my picture gallery I quickly realized that the onMouseOver Prev and Next on the Lightbox were way to confusing for my viewers :) The problem with the design it the Prev and Next links on the Lightbox pop-up are mystery navigation. If you don't know to mouse over the right or left side of the image in order to get the links to appear, you don't.

The Solution: Change lightbox.css to make the navigation graphics always visible

My solution was to change the stylesheet (lightbox.css) to fix the display of the prev and next links to always be visible. I am OK with the prevLabel.gif and nextLabel.gif always showing on top of the image because it makes the navigation so much more obvious.

I know this fix is pretty obvious to the coder types but since many people who use the LightBox Library on their website are not so savvy I hope to take the mystery out of this fix. Simply:

1) Download the new Lightbox CSS File.

2) Remove the .txt from the end of the filename.

3) Make sure the nextLabel.gif and prevLabel.gif and blank.gif are pointed to in the right directory (if they are not in the ./img/ directory you need to change anywhere it says img/ to your directory name, for example images/)

4) Upload the new lightbox.css file to replace the old one

Labels: ,


Post a Comment

<< Home