网页加载时页面显示进度条加载完成之后显示网页内容_Javascript教程-查字典教程网
网页加载时页面显示进度条加载完成之后显示网页内容
网页加载时页面显示进度条加载完成之后显示网页内容
发布时间:2016-12-30 来源:查字典编辑
摘要:现在网上有很多网页加载进度条,但大多都是时间固定的。下面的当查询大量数据时,网页加载较慢,在网页加载时,显示进度条,当网页加载完成时,进度条...

现在网上有很多网页加载进度条 ,但大多都是时间固定的。

下面的当查询大量数据时,网页加载较慢,在网页加载时,显示进度条,当网页加载完成时,进度条消失,显示网页已经加载完成的内容。

复制代码 代码如下:

<html>

<script language=VBScript>

Dim Bar, SP

Bar = 0

SP = 100

Function Window_onLoad()

Bar = 95

SP = 10

End Function

Function Count()

if Bar < 100 Then

Bar = Bar + 1

setTimeout "Count()", SP

else

document.getElementById("jdt").style.display="none"

document.getElementById("content").style.display=""

end if

End Function

Call Count()

</script>

<body>

<div id="jdt" >此处显示进度条,也可以放一张动态图片</div>

<div id="content">网页真正显示的内容</div>

</body>

</html>

----------------------------------------------------

最简单的就是放图片,网页加载完成隐藏图片,显示网页内容

复制代码 代码如下:

<body onLoad="loadDiv.style.display='none';">

<style type="text/css">

#loadDiv {

position:absolute;

z-index:999;

width:expression(document.body.clientWidth);

height:expression(document.body.clientHeight);

background-color:#FFFFFF;

text-align:center;

padding-top:200px;

}

</style>

<div id="loadDiv"><img src="http://www.51ajax.com/images/rss/loading.gif">Loading...</div>

<iframe src="http://505551735.qzone.qq.com/" >

</iframe>

</body>

-------------------------------------------------------

复制代码 代码如下:

<html>

<script language=JavaScript>

function Loaded()

{

document.getElementById("loadDiv").style.display="none"

document.getElementById("content").style.display=""

}

</script>

<body onLoad="Loaded()">

<div id="loadDiv"><img src="http://www.51ajax.com/images/rss/loading.gif">Loading...</div>

<iframe id="content" src="">

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类