PDA

View Full Version : Modal window veil does not cover browser window



carmelaem
11-19-2012, 03:55 PM
1) Script Title: DHTML Modal window v1.1

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex8/dhtmlwindow/dhtmlmodal.htm

3) Describe problem:

Any ideas why the veil in the Modal window does not cover the entire window in Chrome, it works in all other browsers. It appears to be “stuck” in the upper part of the browser.

Example: http://www.areadevelopment.com/advertisers/test-ad.html

Thank you!

jscheuer1
11-19-2012, 05:28 PM
It's because there's no content behind it. I found that even without content, if I set its height to 100% it worked (in the Client265453/1352297198354_modalv3.css file, addition highlighted):


.drag-handle{ /*Overwrite default drag handle bar background color with below*/
background-color: #03277C;
}

#interVeil{ /*CSS for veil that covers entire page while modal window is visible*/
position: absolute;
background: black url(http://www.areadevelopment.com/images/blackdot.png);
height: 100% !important;
width: 10px;
left: 0;
top: 0;
z-index: 999998;
visibility: hidden;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=80);
opacity: 0.8;
}

Be sure to use the !important keyword as shown to override the scripted styles. This may mess up other browsers though. If not, fine, if so - just get some content to the page.

The browser cache may need to be cleared and/or the page refreshed to see changes.

Bottom line - as I first said, if you have a full page of content behind the modal, this shouldn't be a problem.

carmelaem
11-19-2012, 08:27 PM
Thank you, John.

"set its height to 100%" fixed the veil issue!