Hi all.
I am using styles to lock down the GUI until the user enters some info
in a CSS/DIV pop box.
If the user does now scroll before he clicks, the pop box is centered
and the
background color spans the entire page. But, if he scrolls first, say,
to the middle
of the page, then when the click happens you only see the bottom of
the #EAEAEA
background and the pop box. If I take out top:0px and left:0px the
same thing
happens.
How do I get the new background color to ALWAYS cover the page and the
DIV pop
box to ALWAYS be centered?
Here is the CSS:
#myBackground {
background-color:#EAEAEA;
width:100%;
height:100%;
top:0px;
left:0px;
position:absolute;
filter:alpha(opacity=75);
opacity:0.75;
-moz-opacity:0.75;
display:none;
}
And Here Is The HTML:
<body background="img/background.jpg" onload="Init();">
<div id="myBackground"></div>
<div id="myEmail" style="display:none;">
<form id="mailForm" action=""
method="POST" enctype="multipart/form-data" onsubmit="return
makeMailto();">
<div id="six">
<asp:Table
ID="Table6" runat="server" CssClass="tableA" BackColor="white">
<asp:TableRow>
<asp:TableCell CssClass="cellA" ColumnSpan="2">
<div
style="position: relative;">
<div style="color: white; float: left; font-size: large;">
<b>Email This Video</b></div>
<div style="float: right;">
<img src="img/x.png" onclick="HideForm();" style="cursor: pointer;"
alt="close" height="15"
width="15" /></div>
</div>
</
asp:TableCell>
</
asp:TableRow>
<asp:TableRow>
<asp:TableCell>
<asp:Table ID="Table7" runat="server" CssClass="tableB">
<asp:TableRow>
<asp:TableCell CssClass="cellB">
<asp:Table ID="Table8" runat="server" CssClass="tableC">
<asp:TableRow>
<asp:TableCell CssClass="cellNIL">
<input type="radio" name="sharetype" value="Where I clicked"
checked="checked" />
<br />
<input type="radio" name="sharetype" value="From the start"
checked="checked" />
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell CssClass="cellC">
To:
</asp:TableCell>
<asp:TableCell>
<input tabindex="1" id="to" name="to" size="30" />
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell CssClass="cellD" >
Cc:
</asp:TableCell>
<asp:TableCell>
<input tabindex="2" id="cc" name="cc" size="30" />
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell CssClass="cellE" >
Subject:
</asp:TableCell>
<asp:TableCell>
<input tabindex="4" name="subject" size="30" />
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell CssClass="cellF">
Body:
</asp:TableCell>
<asp:TableCell>
<textarea tabindex="5" accesskey="b" name="body" rows="5" cols="35"></
textarea>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell CssClass="cellG">
</asp:TableCell>
<asp:TableCell>
<input type="submit" tabindex="6" onclick="HideForm();" value="Send
Video Link!" />
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</asp:TableCell>
</
asp:TableRow>
</
asp:Table>
</
asp:TableCell>
</
asp:TableRow>
</asp:Table>
</div>
</form>
</div>
