javascript - 如何知道您何时在浏览器中收到图像？

Question

让我自己解释一下，因为我的问题标题可能有点随意。我的网站有很多图片，因此我想说一个加载栏，当我的浏览器接收到图像时，它会将栏 x 像素向右移动。现在，它背后的 CSS 还不错。我遇到的问题是 JavaScript 如何确定何时在浏览器中获取图像？因此，当所有图像都已加载后，我可以简单地显示一个整洁的页面，而用户不会看到所有这些图像在他们的屏幕上缓慢下载。类似于以下站点的内容:

Link

或者甚至我在这里完全错了？上面的链接是如何实现的？任何教程都会有很大的帮助。当我尝试用谷歌搜索“HTML 加载页面”时，这真的是我第一次这样做。

Answer 1

如果您使用的是 jQuery，那么请在图像选择器上使用加载事件，例如

 $(function(){
   $("#image").bind("load", function(E){
     alert("Load");
   });
 });

或者你也可以使用 onload JavaScript 事件

document.getElementById('image').onload = function(){alert("Load");}