javascript - 画面中央にポップアップdivを設定する

Question

ポップアップ div を作成しています。サイズは 521px、高さ 400px です。

ブラウザウィンドウのサイズに関係なく、画面またはブラウザウィンドウの中央に表示されるように設定したいと思います。

ここに私のJavaScriptコードがあります:

<script type="text/javascript">
function show_update_profile()
   {
       document.getElementById('black_fade').style.display='block';
       var dw = document.getElementById('div_register').style.width;
       alert(dw);
       document.getElementById('div_register').style.left= ((window.innerWidth)-dw)/2;
   }
</script>

行alert(dw);はdiv幅を表示しますが、その後の行は機能していません。

Answer 1

次のようにする必要があります。

//remove extra dot
document.getElementById('div_register').style.left= ((window.innerWidth)-dw)/2;

Answer 2

dwで終わる文字列pxです。最初にそれを呼び出しparseIntて、番号自体を取得する必要があります。ただし、JavaScript を使用すると、CSS で簡単に解決できる問題を回避できます。

#div_register {
    left: 50%;
    top: 50%;
    margin: -200px -260px;
}

Answer 3

alert(dw) の出力は何ですか? これに測定単位 (「123px」など) が含まれている場合は、計算で使用する前に int に解析する必要があります。

var dw = parseInt(document.getElementById('div_register').style.width);