PDA

View Full Version : want some added functions in the lightbox



nisha
09-12-2008, 01:10 PM
1) Script Title: Lightbox image viewer 2.03a

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

3) Describe problem:
hi i am into developing my skills and every project i try to do something new and better. i have used this lightbox many times in my sites and i have experience good efects using this lightbox, but now i want to show 4 images one after other when an user clicks on one thumbnail i want to show 4 images of same size one after other by clicking next previous and at the bottom i want a heading of the of the image and below that a 2 lines description about the image.

so i have to display many such thumbnails in my page and on clicking each thumbnail the above mentioned effect should appear.

so can anybody help me in achieving such effect using the lightbox.

Help Appreciated.

jscheuer1
09-12-2008, 02:24 PM
You can already make next/previous groups by using:

rel="lightbox[groupname]"

in place of just:

rel="lightbox"

for your links. Just make sure to use a unique groupname for each group of (in this case) four that you are mentioning. If you want only one thumbnail per group, use no text or image in the other three links.

Now, the caption may be quite extensive, just use the title attribute of the link. Often this looks bad on hover of the thumbnail, but there are ways around that. Here is an example group of four with extensive titles/captions:


<a href="some_0.jpg" rel="lightbox[group_0]" title="<b>Group Zero</b><br>Some interesting JPEG<br>Notice the cool colors"></a>
<a href="some_0.jpg" rel="lightbox[group_0]"><img src="some_0_tbn.jpg" border=0></a>
<a href="some_1.jpg" rel="lightbox[group_0]" title="<b>Group Zero</b><br>Another interesting JPEG<br>Notice the cool caption"></a>
<a href="some_2.jpg" rel="lightbox[group_0]" title="<b>Group Zero</b><br>Yet More interesting JPEG<br>Notice the something else"></a>
<a href="some_3.jpg" rel="lightbox[group_0]" title="<b>Group Zero</b><br>Some really cool Image<br>Notice the hot colors"></a>

Notice that there are five links, only one (the second) has a thumbnail. It will be the one seen and has no title, so there will be no 'tool tip' onmouseover. The first link has a title and the same href as the second so will be selected by lightbox's remove duplicates function as the one to use when displaying the group. The others will be available via next/previous.

One final note - The remove duplicates functionality in lightbox 2.04 (current version on the author's site) is broken. Make sure to use version 2.03a from the Dynamic Drive site.