2012-01-14 14 views
-2

次のコードはFirefoxでは動作しますが、IEでは動作しません。私はきちんと画面 右回転上のdivを中央に必要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ですか?さあ、人!あなたの意見を声に出して、好きではないものを修正することができます。 –

+2

申し訳ありませんが、ローカライズされています。あなたのコード全体をここにダンプするだけでは、あなたのためにそれをデバッグすることはできません。さて、あなたはスクラッチから自分のロールするのではなく、ダイアログ/モーダル/オーバーレイjQueryプラグインをWebで検索しようとしましたか? –

+1

@ frederic-hamidi私は言う:私は自分のコードを使用できないのですか?この場所はプログラマー、エキスパートを助けることです。私はアメリカ人であり、抑圧ではなく表現の自由を私たちに提供する第5回改正を愛しています!!!! – Omar

答えて

2

用途:

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

insteaあなたのposition: relative;marginの数字は#loading_boxです。それらを使用すると、あなたが行っている効果を得るのがずっと難しくなります。

1

あなたのdoctypeが正しくなく、IEをquirksモードにします。代わりにこれを使用して、私たちがどこに立っているかを見てください:<!DOCTYPE html>

関連する問題