本文介绍一种流行的Ajax风格网页Loading效果,适用于大量使用Ajax技术的网站。该效果在页面加载时自动显示带载入动画的提示信息,并在网页加载完成后自动消失,实现正在进行的Loading进度条功能。
Ajax风格Loading效果介绍
当前较为流行的一种Ajax风格网页Loading效果,常见于大量应用Ajax技术的网站。在页面加载过程中,系统会自动显示带有载入动画的提示信息;当网页内容完全加载完毕后,该提示会自动消失。这是一种具备Loading功能的网页进度条组件。
代码实现与结构
<html></P>
<P><head><title>Loading</title><style type="text/css">body{background-color:#000;}#content{display:none;}#loadbox{position:absolute;top:50%;left:50%;margin-left:-68px;margin-top:-36px;width:222px;height:58px;text-align:center;}#loadbox span{display:block;width:222px;height:32px;text-align:center;color:#CCC;font-size:9pt;}</style></head><body><div id="content"><iframe src="#" width="800" height="360" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe></div></body></html> 注意事项
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]