加载指示器“position:absolute”始终显示在顶部

时间:2010-08-20 06:09:59

标签: css css-position

我正在使用asp:updateprogress控件显示加载指示器。这是我的css,

.loading {
   background-color:#404040;
   color:#fff;
   top:0px;
   left:45%;
   height:23px;
   position:absolute;
   font-weight:bold;
   -moz-border-radius-bottomleft:3px;-webkit-border-bottom-left-radius:3px;
   -moz-border-radius-bottomright:3px;-webkit-border-bottom-right-radius:3px;
   clear: both;
 }

当我在页面顶部进行ajax更新时它工作正常我可以看到加载指示器但是当我向下滚动到底部并执行ajax更新时,加载指示器似乎没有显示。我认为这是因为css的位置。无论我的滚动条位置如何,任何使其可见的建议。

<asp:UpdateProgress ID="UpdateProgress1" runat="server" DynamicLayout="false" DisplayAfter="0">
        <ProgressTemplate>
            <div class="loading" style="padding-left: 5px; margin-bottom: 5px;">
                Loading...&nbsp
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>

2 个答案:

答案 0 :(得分:3)

尝试提供父div [{1}},或者如果您希望它显示在同一个地方,无论页面上的滚动位置如何,请尝试position:relative

参考:

答案 1 :(得分:1)

使用position:fixed;