顯示覆蓋覆蓋整個頁面

我有一個網絡應用程序，正在加載iframe內。我需要顯示一個覆蓋div來覆蓋整個頁面。的問題是，覆蓋目前在iframe地區唯一展示，而不是覆蓋整個頁面，（我們的應用程序（子應用程序）是iframe一套應用程序加載的一部分）顯示覆蓋覆蓋整個頁面

來源

2012-08-25 KRR

'#overlay {位置：固定;身高：100％;寬度：100％;背景：黑色; opacity：0.5;}' – adeneo

要覆蓋整個窗口，您必須在原始窗口中創建疊加div，而不是iframe。 –

@ThomasStachl是它的正確，我們需要在原始窗口DOM中做到這一點，非常感謝 – KRR

試着這麼做;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="EN"> 
<head> 
<style type="text/css"> 
html 
{ 
overflow: auto; 
} 

html, body, div, iframe 
{ 
margin: 0px; 
padding: 0px; 
height: 100%; 
border: none; 
} 

iframe 
{ 
display: block; 
width: 100%; 
border: none; 
overflow-y: auto; 
overflow-x: hidden; 
} 
</style> 
</head> 
<body> 

<iframe id="tree" name="myiframe" src="http://www.your_page.com/" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="100%" scrolling="auto"></iframe> 

</body> 
</html>

或者您可能會使用類似JavaScript的文件;

<script type="Text/JavaScript" language="JavaScript"> 
<!-- 
function resize_iframe() 
{ 
    var height=window.innerWidth;//Firefox 
    if (document.body.clientHeight) 
    { 
     height=document.body.clientHeight;//IE 
    } 
    //resize the iframe according to the size of the 
    //window (all these should be on the same line) 
    document.getElementById("cam").style.height=parseInt(height- 
    document.getElementById("cam").offsetTop-8)+"px"; 
} 

// this will resize the iframe every 
// time you change the size of the window. 
window.onresize=resize_iframe; 

//Instead of using this you can use: 
// <BODY onresize="resize_iframe()"> 

</script> 
</head> 
<body> 
<iframe id="cam" width="100%" scrolling="yes" src="http://www.your_page.com" onload="resize_iframe()"> 
</iframe> 
</body>

希望這會有所幫助。

來源

2012-08-25 12:26:40

你可以做這樣的事情

<div id="overlay"></div>

CSS

#overlay 
{ 

    position:fixed; 
    top:0; 
    left:0; 
    bottom:0; 
    right:0; 
    height: 100%; 
    width: 100%; 
    margin: 0; 
    padding: 0; 
    background: #000000; 
    opacity: .3; 
    filter: alpha(opacity=30); 
    -moz-opacity: .3; 
    z-index: 101; 
}

Sample

來源

2012-08-25 12:33:50 freebird

顯示覆蓋覆蓋整個頁面

回答

相關問題