PDA

View Full Version : Lightbox image viewer, need little help..



cagney31
01-22-2011, 02:34 PM
1) Script Title: :: Lightbox image viewer


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

3) Describe problem: Hello, i am fairly new with all this and i need some help pls. At step 3 of this code it says: Then make sure the paths used in the code of step 1 correctly points to this directory.

I dont know where to put what..what do i need to replace?
(I unzip the lightbox.zip into a folder on the site)
Can someone help?
Thank you, Karin

jscheuer1
01-22-2011, 08:53 PM
There is no lightbox.zip at the demo page that you link to. If you're using a version of Lightbox (there are many) follow the instructions for it. If there is a zip, it generally contains a fully functional version. Just substitute your own images.

What script are you using? Where did you get it?

djr33
01-22-2011, 09:21 PM
The zip is listed in Step 3:
http://www.dynamicdrive.com/dynamicindex4/lightbox/lightbox.zip

jscheuer1
01-23-2011, 03:09 AM
Oh, I stand corrected, sorry.


In the case of this particular version, the zip has no folder structure and no demo page included. To set it up:


Follow the steps on the demo page for creating an html page. For now, put this page in its own folder.


For Step 2, put your larger images and thumbnail images in this same folder, and simply enter their filenames in the HTML code as shown. Use the src attribute of the img tag for the thumbnail and the href attribute of the a tag for the larger image that goes with that thumbnail.


Unzip the files from the zip to this same folder.


View the page in the browser.


That's it.

cagney31
01-23-2011, 10:00 PM
Thank you jscheuer1, i will try that.
I only got confused by step 3 were it says:
Then make sure the paths used in the code of step 1 correctly points to this directory.

Step 1: Insert the below code in the HEAD section of your page:

<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>

Above the code, but how do i point to the directory where my files (the zip) are in this code.

Sorry i don't explain it right...

jscheuer1
01-23-2011, 10:18 PM
Well, since I'm telling you to put it all in the same folder (aka: directory), there will be no need to change any of the paths. If you want to move things around, some in one folder, others in other folders, then you have to make sure that on the page the paths to your images, the .js and the .css files are correct, and that inside the .js and .css files that paths to the lightbox helper images are correct. Paths to images in .css files (with one exception) are relative to the .css file. Those in .js files are relative to the page that uses the .js file. In all cases, if there's any confusion, the absolute path may be used.

But to just get it setup, follow my advice in my previous post. It will work.

If you don't understand about files and folders, relative and absolute paths, do some remedial reading on the subject. However, the path to a .css file or to a .js file follows the same rules as for images and links. They have to be correct. Otherwise the browser cannot find the file.

cagney31
01-24-2011, 07:38 AM
It works!
Thanks for explaining.:D
Karin