Lightbox - Help me!

[Metinia]

Lightbox - Help me

Script URL (on DD):
http://66.102.9.104/translate_c?hl=s...4H1KDE4qocMNAw

I've followed this guide, but I just can't make the lightbox-script work. I'm using Macomedia Dreamweaver MX 2004 when I make my website, that's good for you to know when you're gonna help, me maybe... Maybe I've done something wrong when I followed the guide, so I tell you how I did; First I placed the code:

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

in the HEAD of the page, maybe there's somewhere in the HEAD that I should och sholudn't place it? If I have frames do I have to place it in all the frames' HEAD's? Well anyway, after placing that code in the HEAD I placed this code:

<a href="cat.jpg" rel="lightbox" title="Caption- cute cat!"><img src="cat_thumb.jpg" /></a>

in the BODY (but I changed the image, first searched it up, placed it at the page just to see the "name" of it and then used that name. I did the same thing with the thumbnail.) It comes up a thumb and I save the site. And yes, the 3rd step, I have placed all the files that was in the download package in the same map as the site.

After doing all this I view the website I've created in a Browser, both Explorer and Firefox. When I'm clicking at the small thumbnail of the picture the bigger picture comes up, but just as it lays on the background. There's no Lightbox effect at all, no shadow background, no window that's popping up with the image, just the image at a white background and all the other frames are normal.

What have I done wrong, or why isn't it working?

[jscheuer1]

This:

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

Should be:

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

Using DW, you should preview the page in the browser, not in DW. There could be other problems. If you want more help, publish the page and:

Please post a link to the page on your site that contains the problematic code so we can check it out.

[Metinia]

I've changed the code now and layed out the page on the internet. Here's the URL:

http://www.freewebs.com/testisa/

If you click at Portfolio the thumbnail of the picture should turn up, but it doesn't. It did when I preview in a browser in DW. I can't fix a picture right now of how it looks when I'm previewing in a browser in DW, but i'll fix it later.

[Metinia]

Here comes two pictures where I show you how it looks when I preview in a Browser.

This picture shows the thumbnail:


And this picture is when you have clicked on the thumbnail:


As you can see, there's no Lightbox effect at all.

[jscheuer1]

Try it without any frames first, on an ordinary page. Lightbox will not cover any frame other than the one it is in anyway. If that won't work for you, you need a different script.

If you do decide to go with Lightbox, you cannot put the script and style tags inside a style section:

<style type="text/css">
 <!--
 <link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>
body,td,th {
	font-fa . . .

If you were using the right tags (see below*), it should be:

 <link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>
<style type="text/css">
 <!--
body,td,th {
	font-fa . . .

*I notice that you are using the Lightbox v2.03a script, but are only using the tags for the original Lightbox. They are two different scripts, make up your mind which to use and follow the instructions for that version.

original Lightbox:

http://www.dynamicdrive.com/dynamici...tbox/index.htm

Lightbox v2.03a:

http://www.dynamicdrive.com/dynamici...box2/index.htm

Another thing I noticed was that on the live Portfolio.htm, a:link tags have a style display set to 'none', so I can't even see the linked image.

[Metinia]

Yes, I saw that the display was set to 'none', but what should it be? I mean, what should it say so the links is visible? (I'm not good at this...)
Is there maybe anything more that's wrong with the a:link that makes so the lightbox doesn't work? Here it all comes:

a:link {
color: #000000;
text-decoration: none;
background-attachment: scroll;
background-image: url(overlay.png);
background-position: center center;
letter-spacing: normal;
text-align: left;
vertical-align: baseline;
word-spacing: normal;
white-space: normal;
display: none;
margin: 100px;
padding: 100px;
clear: none;
float: left;
height: auto;
width: auto;
border: 10px none #FFFFFF;
list-style-position: outside;
list-style-image: none;
list-style-type: none;

[jscheuer1]

Just skip that part. All style properties default to whatever is normal for that element. So you could use just:

a:link {
color: #000000;
text-decoration: none;
margin: 100px;
padding: 100px;
float: left;
}

and that's assuming you want the color, text-decoration, margins and padding, and float properties listed. You should probably just get rid of the entire thing.

[Metinia]

Thankt you very much, I think I (or maybe you...) have made it work.

But I have some more question:

Can I change so the lightbox comes a little bit higher up on the page?

Can I take away the small text in the right, below corner that says: "press x to close"?

Can I change the colour of the lightbox (I mean the colour of the border around the picture and below the picture where there is a small text)?

[jscheuer1]

Sure, but what version are you using?

[Metinia]

I'm using the first version, the original. (Is it named Lightbox 1.0 maybe?)

This one that's here:
http://www.dynamicdrive.com/dynamici...tbox/index.htm