menu

Sunday, December 26, 2010

Lightbox alternate:- zeeBox :D

Hii guys,

Day before i was completing ma gallery and suddenly found that the Lightbox module is SOOO hard to manipulate with + edit as i want. So, i was tired that day and today started to make an alternative that would use the jQuery framework and take less space :D

So here i'm over with a little my own Lightbox. The module is not soo complete but it can do many functions (with the same animations and effects) of the light BOx. The good part is the WHOLE thing is just 1 php file and you can edit these easily as they are easily understandable. I'm willing to write a 'How to make your own lightbox' but for now i'll give the link to download the one i made. PLEASE tell your ideas so i can improve it :D


Demo :        http://zontek.zzl.org/tuts/zeebox/demo/
Download:  http://zontek.zzl.org/tuts/zeebox/zeebox.rar

Usage:

1) Extract the contents and a folder called 'zeebox' will be there.
2) Add these between <head></head>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="zee-core.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">

3) Immediately after the start of <body> put this
<div id="overlay" onClick="clean()"></div>
<div id="container"></div>

4) To make an image shown in it edit the img tag like this
<img src="test.jpg" alt="Description about the image. Note that HTML coden put inside too works" onClick="zee(this.src,this.alt);" />

That's ALL :DD
Here you go!!



cyah all

No comments:

Post a Comment