2010-10-17 18 views
1

我使用以下代碼在顯示彈出窗口時淡出背景。這是div容器在IE中佔用的背景淡出

CSS的相同

#VbackgroundPopup{ 
display:none; 
position:fixed; 
_position:absolute; /* hack for internet explorer 6*/ 
top:0; 
left:0; 
background:#000000; 
border:1px solid #cecece; 
z-index:1; 
} 

當一些點擊一個div我顯示一個彈出,並通過使用

function GreyoutBackground() { 
    $("#VbackgroundPopup").css({ 
     "background-color": "#000000", 
     "filter": "alpha (opacity=70)", 
     "filter": "progid:DXImageTransform.Microsoft.Alpha(style=0, opacity=70)", 
     "-moz-opacity": "0.7", 
     "opacity": "0.7", 
     "-khtml-opacity": ".7", 
     "zoom": "1" 
    }); 
    $("#VbackgroundPopup").css({ "opacity": "0.6" }); 
    $("#VbackgroundPopup").show(); 
} 

上面的代碼是變灰背景在Firefox中工作正常,但在Internet Explorer中它不工作,有人可以告訴我什麼是問題。 我試圖寬度100%和高度100%,也沒有鍛鍊

+0

你不是說問題是什麼? – 2010-10-17 21:29:20

+0

greybackground沒有進入ie,如果它必須工作,我必須給出像1000px的寬度;和高度爲3000%,但寬度和高度對於頁面是動態的,因爲高度取決於頁面中的任何項目。 – kobe 2010-10-17 21:35:28

+0

kobe 2010-10-17 21:36:02

回答

1

這工作正常(在IE6測試過):

<!DOCTYPE html> 
<html> 
<head> 
    <title>Fade</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head> 
<body> 

<button>Fade in the overlay</button> 
<div id="overlay"></div> 
<style> 
* { 
    margin: 0; 
    padding: 0; 
} 
html, body { 
    height: 100%; 
} 
#overlay { 
    background-color: #000000; 
    display:none; 
    height:100%; 
    top: 0; 
    left: 0; 
    position: fixed; 
    _position: absolute; 
    width: 100%; 
    z-index: 999; 
} 
</style> 

<script type="text/javascript"> 
jQuery(document).ready(function($){ 
    $('button').click(function(){ 
     $('#overlay').fadeTo('slow', 0.5); 
    }); 
}); 
</script> 


</body> 
</html> 

我者優先使用fadeTocss('opacity')因爲過渡的動畫。

+0

感謝wildpeaks。 – kobe 2010-10-18 02:46:30