想要在页面中心显示自定义等待控件答案

【问题标题】：Want to show Custom wait control at center of page想要在页面中心显示自定义等待控件
【发布时间】：2012-03-11 17:57:43
【问题描述】：

我从 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 之类的。

【问题讨论】：

标签： jquery asp.net reporting-services

【解决方案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

【讨论】：

【解决方案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>");
});

【讨论】：