Submit your widget
HomeLightbox & Dialog & Overlaysimple Lightbox JQuery Plugin

simple Lightbox JQuery Plugin

Created 14 years ago   Views 25595   downloads 5285    Author chillwebdesigns
simple Lightbox JQuery Plugin
View DemoDownload
113
Share |

ChillBox is a JQuery Plugin is a simple, unobtrusive script used to overlay images on top of the current page. It can be used for link anchor attributes. ChillBox has been tested with IE6, IE7, IE8, Firefox, Google Chrome, Opera and Safari.

Step One - Download ChillBox

Downlaod chillbox.js and place it in your javascript directory in this example we are using a directory called 'js'.

Step Two - Download JQuery

ChillBox is a JQuery Plugin, therefore you will require Jquery for it to work. Simply download the latest version from the JQuery Website and save it to the 'js' directory.

Step Three - Add PlugIn & Framework to the head section

Now add the Jquery Framework and chillbox-packed.js to the head section of your web page. Now we should have something like below in our head section: 

<head>

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/chillbox-packed.js"></script>

</head>

Step Four - Add ChillBox to Links

Now we can now add ChillBox to our html code. To do this create a anchor link attribute. Then we we are going to add a rel="ChillBox" as we want the Chilltip to be applied to this link. Then add the title="YOUR CONTENT" attribute to give a description of what the image and then write the path to your image in the href="images/example.jpg". 

<head>

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/chillbox-packed.js"></script>

</head>
<body>

<a href="images/all/great-yarmouth.jpg" rel="ChillBox" title="Great Yarmouth Sea Front">Show Image.</a>

</body>

Support

Can I use the script in a commercial project?

ChillBox is licensed under the Creative Commons Attribution 2.5 License. As for correct attribution, all that is required is that you leave my name and link at the top of the chillbox.js (Javascript File). I would appreciate an html link, but it is not required.

What versions of JQuery will ChillBox work with?

ChillBox has been tested on all JQuery Versions 1.3 to 1.4.2 (Latest Version).

You might also like