JavaScript 实现页面加载进度条代码

作者:半夏时间:2026-10-24 19:33:54浏览:122

本文提供了一段使用 JavaScript 实现的页面加载进度条代码示例。该代码通过监听图片加载状态来动态更新进度条,并在页面完全加载后显示提示信息。

页面加载进度条实现代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <HEAD> <TITLE> New Document </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  <style type="text/css"> <!-- body {background-color:#000;} #imglist { display:none;color:#FFFFFF;} #loadbox { width:160px;height:60px; position:absolute;top:50%;left:50%;margin-left:-80px;margin-top:-30px;} #loadbox span {height:30px;display:block;width:160px;text-align:center; color:#FFF; font-size:12px;} --> </style> </HEAD> <BODY> <div id="imglist"> <h1>欧文加油!</h1> <img src="/upload/2010-4/20100411182122712.jpg" /> <img src="/upload/2010-4/20100411182123800.jpg" /> </div> </BODY> </html> 

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

作者最新文章