GMail右上角的Loading效果

2012/11/12 13:00:44作者：佚名來源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

GMail右上角的Loading效果

【實(shí)例描述】

在打開GMail郵箱的時(shí)候，如果郵箱中內(nèi)容太多會(huì)在頁面的右上角出現(xiàn)一個(gè)提示等待的效果。本例模擬這個(gè)效果，實(shí)現(xiàn)一種頁面加載特效。

【實(shí)例代碼】

<html>
<head>
<title>加載效果-學(xué)無憂（www.wangbatian.cn）</title>
<script language="javascript">
function hideMsg()
{
   document.getElementById("msgDiv").innerHTML="";
//取消等待狀態(tài)的顯示
}
</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>

【運(yùn)行效果】

GMail右上角的Loading效果運(yùn)行效果