PDA

View Full Version : LightBox v2.03 Help please



deelightuk
02-23-2009, 01:04 PM
1) Script Title: Lightbox JS v2.03

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

3) Describe problem: Not working properly on image sets.

Ok I have a button on my website that has a rollover mouse image and when I click on it I would like it to go the lightbox.

It works fine shen using one picture but when I try to add more images and group them together it knocks the buttons out of kilter and things don't line up, I don't know why it is doing this, Here is my code using one image:

<td colspan="3" rowspan="4"><a href="images/adpic1.jpg" rel="lightbox" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image67','','images/index_23.gif',1)"><img src="images/2nd_nav_portfolio_off.gif" alt="View Portfolio" name="Image67" width="95" height="119" border="0"></a></td>

And here is my code using a set of images:

<td colspan="3" rowspan="4"><a href="images/adpic1.jpg" rel="lightbox[ads]" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image67','','images/index_23.gif',1)"><img src="images/2nd_nav_portfolio_off.gif" alt="View Portfolio" name="Image67" width="95" height="119" border="0"></a>
<a href="images/adpic2.jpg" rel="lightbox[ads]"></a>
<a href="images/adpic3.jpg" rel="lightbox[ads]"></a>
<a href="images/adpic4.jpg" rel="lightbox[ads]"></a>

</td>

I have also added a couple of screenshots to show you how it messes up:

http://img12.imageshack.us/img12/8936/80375559wx1.jpg

http://img27.imageshack.us/img27/5733/92230275pa2.jpg

Just to say that the lightbox does work on the image set it just knocks my other images out. I hope someone can help.

jscheuer1
02-23-2009, 04:18 PM
Depending upon a number of factors (like the browser, DTD, the sort of element(s) and style involved, and where it is), a linebreak in your source code can sometimes be as good as a space and/or a <br> tag.

Here is what I would suggest:


<td colspan="3" rowspan="4"><a href="images/adpic1.jpg" rel="lightbox[ads]"
onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('Image67','','images/index_23.gif',1)"><img
src="images/2nd_nav_portfolio_off.gif" alt="View Portfolio" name="Image67"
width="95" height="119" border="0"></a><div style="display: none;">
<a href="images/adpic2.jpg" rel="lightbox[ads]"></a>
<a href="images/adpic3.jpg" rel="lightbox[ads]"></a>
<a href="images/adpic4.jpg" rel="lightbox[ads]"></a>
</div></td>

deelightuk
02-23-2009, 06:48 PM
Thank you so much John, it worked a treat!:)