Jump to content

Help with Div Overlay (kind of like lightbox)


rondog

Recommended Posts

I am having a problem in firefox and safari where the overlay gets created, but if you scroll down, the overlay has only covered the visible screen. So in other words the overlay div stops halfway down the page. However in IE it covers up the entire page no matter how much scrolling is required. Here is my code:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>newCourse</title>
<script src="swfobject.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<style type="text/css">
body {
margin: 0;
padding: 0;
}
#bgholder {
background:url("images/bg.jpg") repeat-x;
}

.fader {
display:none;
position:absolute;
top:0;
left:0;
width:100%;
height: 100%;
background-color: #000;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
</style>
</head>
<body>
<div id="bgholder">
  <div id="black" class="fader" onClick="document.getElementById('black').style.display='none';"></div>
    <div align="center" id="player">
      <script type="text/javascript">
        // <![CDATA[
        var so = new SWFObject("newCourse.swf", "vforum", "900", "370", "9", "#ffffff");
        so.addParam("allowfullscreen", "true");
        so.write("player");
        // ]]>
      </script>
    </div>
  <a href="javascript:void(0)" onClick="document.getElementById('black').style.display='block';">asd</a>
  </div>
</body>
</html>

Link to comment
Share on other sites

Try giving the overlay div position:fixed

 

It should solve your problem, though it may create others. But there is no way to know without trying.

 

note: you may have to add and remove position:fixed with javascript, or it will cause other problems.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.