AJAX--UpdateProgress设置CSS元素POSITION的使动画居中 & loading的Info

http://www.ajaxload.info/  loading的Info
http://www.bigik.cn/blog/article.asp?id=182 

如果你了解现在流行的AJAX,一定看到过类似的Loading小动画:

下面是专门提供这类GIF动画的几个网站,也许有一天会用得上。

http://www.ajaxload.info/
这个网站可以按照你输入的条件即时生成Loading动画!而且风格是我喜欢的:P

http://mentalized.net/activity-indicators/

http://www.napyfab.com/ajax-indicators/


页面上用到了Atlas的控件<atlas:UpdateProgress，以便在进行各种操作时显示一个等待图标，给用户解解闷，好让他们在漫长的等待结果的岁月中不那么烦躁，知道系统正在忙。

形如：

<asp:UpdateProgress ID="UpdateProgress1" runat="server" >

    <ProgressTemplate>

    <img src="../images/loading.gif" alt="请稍候..." />

</ProgressTemplate>

</asp:UpdateProgress>

可是这样写的话图标就歪在一边，不显眼。如果写上个绝对定位，比如

style="position:absolute;left:400px;top:300px;",可这仅仅适合800*600的屏幕，而用户的屏幕分辨率千差万别。

最后发觉可以用百分比，这样写：

<asp:UpdateProgress ID="UpdateProgress1" runat="server" >

    <ProgressTemplate>

    <img src="../images/loading.gif" alt="请稍候..." style="position:absolute;left:50%;top:50%;"/>

</ProgressTemplate>

</asp:UpdateProgress>

 

这样不管什么情况下，图标都会居于页面之中。