想要在頁面中心顯示自定義等待控制

Question

我從stackoverflow得到了訣竅，通過使用jQuery操作DOM來隱藏加載消息。添加下面的腳本與的ReportViewer的頁面沒有訣竅：

<script type="text/javascript"> 
$(function() { 
    var waitMsg = $("div[id$='AsyncWait_Wait']"); 
    waitMsg.wrap("<div style='display:none; visibility: hidden'></div>"); 
}); 

，而我想在頁面的中心，以顯示自己的消息和圖像。只是引導我如何在呈現報告之前顯示我的消息。我需要掛鉤的方法。 onwindowload類似。

Answer 1

你可以通過使用CSS

<style type="text/css" media="screen"> 
/* commented backslash hack for ie5mac \*/ 
html, body{height:100%;} 
/* end hack */ 
.CenterPB{ 
position: absolute; 
left: 50%; 
top: 50%; 
margin-top: -30px; /* make this half your image/element height */ 
margin-left: -30px; /* make this half your image/element width */ 
} 
</style> 

，你必須在div

$(function() { 
    var waitMsg = $("div[id$='AsyncWait_Wait']"); 
    waitMsg.wrap("<div class='CenterPB' 
     style='display:none;height:60px;width:60px;'>Message here</div>"); 
}); 

參考進度條：
http://www.sitepoint.com/forums/1243542-post9.html
http://www.search-this.com/2008/05/15/easy-vertical-centering-with-css/

Making Update Progress Panel in the center

Answer 2

您可以將其添加到相同的確切功能。類似於

$(function() { 
//Get message ref 
var waitMsg = $("div[id$='AsyncWait_Wait']"); 

//Add custom message 
var customMessage = $(document.createElement("div")); 
customMessage.text("My message..."); 
waitMsg.before(customMessage); 

//Hide message 
waitMsg.wrap("<div style='display:none; visibility: hidden'></div>"); 
});