在屏幕中央設置彈出式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);