Lightbox Viewer

[chechu]

1) Script Title: Lightbox Viewer

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

3) Describe problem: Hey,
I'd like to know if it is possible to have the lightbox showing from a text link. As shown on DD, all the thumbnails need to be placed to be able to show all in a roadtrip. I'd like to place a textlink (f.ex. 'portfolio'), and when you click on it, one image comes up with the possibility to go on a roadtrip (prev-next).

[ddadmin]

I believe what you can do physically define the text links that point to their enlarged image and that belong in the same group, but "hide" all but the first link. For example:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]" style="display:none">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]" style="display:none">image #3</a>

Untested, but worth a shot.

[chechu]

Thanks a lot !
As I work with a restricted computer, can anyone please test if this is useable in IE and Firefox, old and new browsers ?

[chechu]

I have two textlinks, one next to the other, and I want them to display two different roadshows.
How can that be done, as now, the second textlink follows the roadshow of the first textlink.

[ddadmin]

I have two textlinks, one next to the other, and I want them to display two different roadshows.
How can that be done, as now, the second textlink follows the roadshow of the first textlink.

Theoretically, you'd have something like this then:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image 1a</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]" style="display:none">image 1b</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]" style="display:none">image 1c</a>

<a href="images/image-1.jpg" rel="lightbox[roadtrip2]">image 2a</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip2]" style="display:none">image 2b</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip2]" style="display:none">image 2c</a>

The key is just to use a different element name for rel="lightbox[roadtrip2]" for each group of links.

[chechu]

Problem solved !!!! Thanks so much.

[chechu]

How can I get rid of "image 2 of 17" on the bottom of every image ?
Also, there is a white area on the bottom; how do I put that black also ?
Please go to http://www.cecicasariego.com and click on the botom left (portfolio) on 'portraits' to see what I mean.
Thanks !

[ddadmin]

How can I get rid of "image 2 of 17" on the bottom of every image ?
Also, there is a white area on the bottom; how do I put that black also ?
Please go to http://www.cecicasariego.com and click on the botom left (portfolio) on 'portraits' to see what I mean.
Thanks !

Well, the line:

Element.setInnerHTML( 'numberDisplay', "Image " + eval(activeImage + 1) + " of " + imageArray.length);

inside the .js file controls the showing of "image x of total". Commenting that line out should do the trick.

Most of the lightbox's look should be controlled by lightbox.css. Just glancing over that file, it would seem the pertinent line is this:

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

I may be wrong though. Try experimenting a bit with the .css file.

[chechu]

It worked out fine, thanks.
I think the problem with the white bg at he bottom is when you need to scroll down to see the text below the image. Go to http://www.cecicasariego.com and click on portraits (portfolio), and you'll see that the smaller imgs do not have the white line below, as you don not need to scroll down. Is there a solution for that ?

[busybee]

hiya,
newbie here in forums. was playing with the lightbox and was wondering if it's possible to have the next and previous buttons appear permanently without the mouse rolling over it?

also, does anyone know how to add thumbnails inside the lightbox itself, like those found in firefox theme download pages?

any help would be greatly appreciated.

thanks.