在 html 页面加载和渲染期间显示 throbber

Question

我有一个渲染缓慢的页面。 网络旅行很快。 页面的初始加载速度很快。 您实际上可以看到（如果您的机器足够慢）html 组件的初始布局。 然后运行一些 javascript 的东西，使其中一些组件全部支持 ajax。 最后CSS被应用。

我对 javascript 无能为力，因为它让一切都变得缓慢。 所以我需要一个 throbber 来告诉用户稍等，浏览器正在工作。 有没有办法捕获浏览器完成渲染事件？ 还有这样的活动吗？ 还有其他方法可以做到这一点吗？

Answer 1

在代码运行之前显示 throbber，然后隐藏它。

使用 JQuery：

$("#throbber").show();
/* Your AJAX calls */
$("#throbber").hide();

Answer 2

在调用所有 Ajax 内容之前检查 DOM 何时准备就绪。

使用 原型：

document.observe("dom:loaded", function() {
  //your code
});

使用 jQuery ：

$(document).ready(function() {
      //your code
});

Answer 3

看一下：http://plugins.jquery.com/project/throbber