This is something every website developer should have uploaded on their servers, i have:

http://www.jakemchugh.co.uk/dev/lightbox

Many of my clients have wanted image gallery’s and this is a nice little effect that brings more attention towards the image being shown, You can download it here:

http://www.lokeshdhakar.com/projects/lightbox2/

How to use this:

• Download and extract the contents

• Add the following lines to your “HEAD” section of your HTML page, change to be appropriate.

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

• When you have added the image add rel=”lightbox” into your img code, like this:

<img src=”IMAGEURL” alt=”" rel=”lightbox” />

Whey hey, there it is… Working
[Please check the lightbox website for more info] Here

I hope to post your more effects to help you enhance your web UI.

Leave a Reply