Hi guys
I have a lightbox on my new theme which is currently still being developed.
Basically, on click, two divs will appear, one of which will be the background, and one the 'foreground'.
I want the background to display to the bottom of the page, not just to the fold. Here is the CSS:
#screenoverlay
{
background-color: #000000; /* The color to display*/
/* The transparency of the background */
opacity: .60;
filter: alpha(opacity=60);
position: absolute;
left: 0px;
top: 0px;
width: 100%;
margin-top:29px;
height: 100%;
/* Set the overlay so it appears above the page content */
z-index: 1000;
}
#topbox
{
position: absolute;
/* Default positioning, that will be overridden by the javascript */
left: 25%;
right: 25%;
top: 25%;
bottom: 25%;
padding: 5px;
width: 50%;
height: 50%;
background-color: #FFFFFF;
/*Must use a z-index greater than the screen overlay*/
z-index: 1001;
}
The reason I have a margin of 29px is because I am using a fixed headbar.
Live: http://www.technofinger.com/?preview_theme=zinefinger
Thanks in advanced,
Kenneth