GMail右上角的Loading效果

2012/11/12 13:00:44作者：佚名来源：网络

移动端

【实例名称】

GMail右上角的Loading效果

【实例描述】

在打开GMail邮箱的时候，如果邮箱中内容太多会在页面的右上角出现一个提示等待的效果。本例模拟这个效果，实现一种页面加载特效。

【实例代码】

<html>
<head>
<title>加载效果-学无忧（www.xue51.com）</title>
<script language="javascript">
function hideMsg()
{
   document.getElementById("msgDiv").innerHTML="";
//取消等待状态的显示
}
</script>
</head>
<body onunload="window.open('http://http://www.google.com')" 
scroll=no topmargin=0 leftmargin=0 rightmargin=0 bottommargin=0>
<div style="position:absolute;top:10;left:10;" id="msgDiv">
<font color=red>loading.........</font></div>
<iframe onload="hideMsg()" style="position:absolute;top:40;left:10;" 
src="http://www.sina.com.cn" width=300 height=200></iframe>
</body>
</html>

【运行效果】

GMail右上角的Loading效果运行效果