顯示seciond時間之前，頁面中間的居中對齊不起作用

我目前正在使用HTML/CSS/Javascript。我有一個稱爲消息的div id和一個顯示消息的javascript函數，並且在這麼多秒後調用另一個函數來隱藏它。顯示seciond時間之前，頁面中間的居中對齊不起作用

除了第一次調用showMessage函數時，消息div被稍微推向右邊（非常明顯不在屏幕中心），然後5秒後hideMessage運行並隱藏div消息。

如果我然後再次調用showMessage函數div正確居中在屏幕中間。

id消息的css只有display: none;。

以下是showMessage函數在顯示div之前添加的messageError類的css。

.messageError 
{ 
    position: absolute; 
    top: -48px; 
    width: auto; 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
    background-color: #ff3d3d; 
    border: #c10000 solid thin; 
    border-radius: 5px; 
    color: white; 
    font-weight: bold; 
}

下面是JavaScript使用

function showMessage(persistent, message, type) 
{ 
    $('#message').css({ 
     position:'absolute', 
     padding: '10px', 
     left: ($(window).width() - $('#message').outerWidth())/2 
    }); 

    $("#message") 
     .hide() 
     .html(message); 

    if (type == "error") 
    { 
     $("#message").addClass("messageError"); 
    } 
    else if (type == "workingComplete") 
    { 
     $("#message").addClass("messageWorkingComplete"); 
    } 

    $("#message").fadeIn("slow"); 
    if (!persistent) 
    { 
     setTimeout("hideMessage()", 5000); 
    } 
} 

function hideMessage() 
{ 
    $("#message") 
     .fadeOut("slow"); 
     removeClass("messageError") 
     .removeClass("messageWorkingComplete") 
}

代碼我怎樣才能讓這個股利是在中間的第一次，而無需關閉並重新加載，使其出現在中間。

感謝您提供的任何幫助。

來源

2012-10-05 Boardy

在這裏添加html也是有幫助的。 – ultranaut

也許試試'.outerWidth（true）'？ – Ohgodwhy

@Ohgodwhy剛剛嘗試過，但沒有運氣 – Boardy

通常情況下，我不喜歡用：

width:auto;

如果你試圖居中DIV。指定寬度左右，

margin:0 auto;

可以做的伎倆。也注意到你分配了一個類，其中沒有發佈你的問題。這也可能是問題所在。如果你使用chrome，一旦你看到結果，右鍵點擊它，然後使用「檢查」元素。這將打開檢查員並向您展示所有的CSS（以及其他非常有用的東西），可以指導您解決問題的可能性。 Registers Luis

來源

2012-10-06 01:05:22

顯示seciond時間之前，頁面中間的居中對齊不起作用

回答

相關問題