在中心制作更新进度面板

Question

我对更新进度面板有疑问。 我想在屏幕中间安装更新进度面板，有人可以建议我吗？ 这样做的想法是什么？

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 中有进度条

<div class="CenterPB" style="height:60px;width:60px;" >Progress bar here</div>

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

Answer 2

系统正在处理时，更新进度面板会显示一些内容（一些文本、图像、一些标记）。

所以你需要使用你添加的标记..

例如，如果你有一个显示的 div，你可以让它像这样在中心。

<div style="width:200px;margin:0 auto;">Processing...</div>

这将在其容器的中心显示 div。

完整示例：

<asp:UpdatePanel ID="updatepnl1" runat="server">
    <ContentTemplate>
        <asp:GridView id="gv1" runat="server">
        </asp:GridView>
        <asp:UpdateProgress id="UpdateProg" runat="server">
            <ProgressTemplate>
                <div style="width:200px;margin:0 auto;">Processing...</div>
            </ProgressTemplate>
        </asp:UpdateTemplate>
    </asp:ContentTemplate>
</asp:UpdatePanel>

当然，您应该将 css 放入 css 文件并将其应用于 class。

喜欢：

///Start css

.posCentre{width:200px;margin:0 auto;}

///End css

并将您的 div 更改为：

<div class="posCentre">Processing...</div>

Answer 3

如果您使用 jQuery，您也可以尝试（非常轻量级的）固定中心插件。