页面加载的进度条显示

关注

原创最新推荐文章于 2026-02-14 00:29:09 发布 2.7k 阅读 AI 写同款· GEO 优化 ›

如何让普通网站页面跳转时显示加载进度条？有没有人注意到 GitHub 和 YouTube 这些网站在页面跳转时，网页顶部总是会显示一个加载进度条？传统的普通网站(指点击链接后页面跳转会刷新页面)如何实现网页加载进度条？比如: GitHub: 点击进入某个仓库，或者进入某个项目的文件夹时屏幕顶部总是会显示一个加载进度条，并且页面不会刷新 YouTube: 点击观看某个视频时，屏幕顶部总是会显示一个加载进度条，并且页面不会刷新阅读详情

页面加载的进度条显示

在<Head>标签中加入下面代码即可

<div id="Loading" style="Z-INDEX:1; LEFT:0px; WIDTH:100%; POSITION:absolute; TOP:0px; HEIGHT:100%; BACKGROUND-COLOR:#f2f8ff">
   <table width="100%" height="100%" border="0" cellpadding="5" cellspacing="0" ID="Table1">
    <tr>
     <td align="center"><img src="../images/crystalStyle/common/loading_title.gif" width="154" height="50"><br>
      <br>
      <span class="fontDGTitle">请稍等，正在加载......</span><br>
      <br>
      <img src="../images/crystalStyle/common/loading.gif" width="200" height="3" border="1"></td>
    </tr>
   </table>
  </div>
  <script language="javascript" type="text/javascript">
function window.onload()
{
document.all.Loading.style.display="none";
}
  </script>