LightBox - Webmaster Forum - Web Design, Programming and SEO forums

09-15-2008, 01:59 PM

William

Status: Junior Member
Join date: Apr 2008
Location: Orlando Florida
Expertise:
Software:

Posts: 35

iTrader: 0 / 0%

William is on a distinguished road

LightBox

Somebody Know how to customize the Lightbox I would like to change the Black around the picture when it is on use.

Thanks

09-15-2008, 02:04 PM

Normo

Status: Member
Join date: Aug 2008
Location: Hampshire, UK
Expertise:
Software:

Posts: 202

iTrader: 1 / 100%

Normo is on a distinguished road

Which version are you using?

09-15-2008, 02:05 PM

wezy

Status: Junior Member
Join date: Jul 2008
Location: Belgium
Expertise:
Software:

Posts: 26

iTrader: 0 / 0%

wezy is on a distinguished road

What black do you mean, the semi transparent black background?

09-15-2008, 03:14 PM

William

Status: Junior Member
Join date: Apr 2008
Location: Orlando Florida
Expertise:
Software:

Posts: 35

iTrader: 0 / 0%

William is on a distinguished road

Originally Posted by wezy

What black do you mean, the semi transparent black background?

Yes and the white around the pics too and im using the latest lightbox 2

09-15-2008, 07:17 PM

Normo

Status: Member
Join date: Aug 2008
Location: Hampshire, UK
Expertise:
Software:

Posts: 202

iTrader: 1 / 100%

Normo is on a distinguished road

To change the background black colour:
Open lightbox.css then find: (replace the red text with the colour of your choice)

Code:

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000000; }

To change the white parts:
Find in the same file: (again change the red text to your colour of choice)

Code:

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

and

Code:

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #000000; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; }

Hope that helps.

09-16-2008, 02:02 AM

William

Status: Junior Member
Join date: Apr 2008
Location: Orlando Florida
Expertise:
Software:

Posts: 35

iTrader: 0 / 0%

William is on a distinguished road

Originally Posted by Normo

To change the background black colour:
Open lightbox.css then find: (replace the red text with the colour of your choice)

Code:

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000000; }

To change the white parts:
Find in the same file: (again change the red text to your colour of choice)

Code:

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

and

Code:

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #000000; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; }

Hope that helps.

Thanks a lot !