Lightbox image viewer 2.03a help needed

[emanuelle]

1) Script Title:Lightbox image viewer 2.03a

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

3) Describe problem:
I have few issues here:
1 .I would like the close button to be on the top
2. I want to remove the image number display
3. I would like to add to the description txt and some styles. is that possible?

I am attaching a link to the page and the design
http://www.alexis-html.com/nihuta/div.html
http://www.alexis-html.com/nihuta/nihuta.jpg

thank you!

[WvS]

Hi, I'm by no means a specialist but I think you can remove the image numbering by deleting:

#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }

Out of the lightbox.css

Just a bit lower to that code is the code for the navigation button to close the image.
I am not totally sure on how to change this to get it to the top...

#imageData #bottomNavClose{ width: 30px; float: right; padding-bottom: 0.7em; }

I suspect theres a bit of code in jquery.js that needs to be put in another place in the coding.
But not to sure if that is the only thing (I do know which bit...just dont know if there are corresponding things that need to be changed with it)
I best leave that to someone who does know before I give advice which screws it up


Then delete the folowing from the lightbox.js

var objNumberDisplay = document.createElement("span");
objNumberDisplay.setAttribute('id','numberDisplay');
objImageDetails.appendChild(objNumberDisplay);

Well anyway thats how I would try to acomplish the changes... (just be sure you use a "test" page instead of the actual thing )


For the styles to the description:

#imageDataContainer{
font: 14px Arial;color:#615146;font-weight:normal;
text-align:left;
direction:ltr;
background-image:url(images/dialog2_bottom.png);
background-repeat:no-repeat;
background-position:bottom left;
width:638px;
margin: 0 auto;
line-height: 1.4em;padding:0px 40px 0 30px;
}

Change the corresponding items you want changed to the style in this piece of the lightbox.css
And do the same in the

#imageData{ padding:0 10px; font: 14px Arial;color:#615146;font-weight:normal; }

(not sure if they both need to be changed but I suspect they do.)

Hoping to have helped,

regards, Wilma