2012-01-14 49 views
-2

下面的代碼在Firefox中可以工作,但不在IE中。IE瀏覽器:中心和覆蓋屏幕上的div

我需要正確屏幕居中 - 右現的股利是一邊倒太多底部

我也需要做出這個div(ID =「加載」),以封面上的格整個窗口 - 並採取所有的點擊,以防止點擊其他地方。

它需要與IE兼容。

HTML

<html> 
<head> 
<title>Overlay</title> 
    <link href="loading.css" rel="stylesheet" type="text/css" /> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="loading.js"></script> 
</head> 
<body> 
This paragraph is for testing 
<br/> 
Hello world! 
<br/> 
How are you? 
<br/> 
Be happy! 
<br/> 
<input id="cmd" type="button" value="Test" /> 
</body> 
</html> 

CSS

#loading { 
    background-color: black; 
    background-color: rgba(1, 1, 1, 0.7); 
    bottom: 0; 
    left: 0; 
    position: fixed; 
    right: 0; 
    top: 0; 
} 

#loading_box { 
    width: 150px; 
    height: 35px; 
    border: 5px solid #FFFFFF; 
    padding: 5px; 

    text-align: center; 
    margin-top: 50%; 
    margin-left: 50%; 
    position: relative; 
    top: -15.5px 
} 

#loading_img { 
    width: 31px; 
    height: 31px; 
} 

#loading_txt { 
    color: #49a0dc; 
    font-weight: bold; 
    margin-left: 0.5em; 
    font-family: "Arial Black", Gadget, sans-serif; 
} 

示例文件 http://punkbunny.com/tmp/overlay/overlay.html

+2

這不是_greatest_的問題,但爲什麼downvotes?來吧,人們!發表你的意見,以便他可以解決你不喜歡的任何問題。 – 2012-01-14 00:39:15

+2

對不起,這太本地化了。你不能把你的整個代碼轉儲到這裏,並期望我們爲你調試它。另外,你是否嘗試在網上搜索對話/模式/覆蓋jQuery插件而不是從頭開始自己編寫? – 2012-01-14 00:40:53

+1

@ frederic-hamidi我會說:爲什麼我不能使用我自己的代碼?這個地方是幫助程序員,專家與否。不是一個可以改變人們做事情的網站......我是美國人,喜歡第五修正案,它爲我們提供言論自由而不是壓制! – Omar 2012-01-14 00:54:25

回答

2

用途:

#loading_box { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin-top: -17px; 
    margin-left: -75px; 
} 

instea d的position: relative;margin s在#loading_box元素上。使用這些將很難得到你想要的效果。

1

您的文檔類型不正確,導致IE進入怪癖模式。改爲使用這一個,看看我們的立場:<!DOCTYPE html>