显示图像加载进度条

Question

晚上好,

我正在建设一个网站，我将从一个远程网站加载图像。现在，在图像完全加载之前，页面是空白的。我希望有人能向我展示一个简单的方法来显示图像的加载进度，无论是通过百分比还是使用像引导程序进度条这样的东西。

现在我使用的是纯HTML：

<img src="http://www.someWebSite.com/testImage.png" alt="Test">

有什么建议吗？

Answer 1

我推荐使用bootstrap(或任何其他框架)。使用JQuery编写伪代码

('#yourDiv').append(#loading);
('#yourImage').onLoad(function(){
     ('#yourDiv').append(#yourImage);
     ('#yourDiv').delete(#loading)
});

哪里

1. yourDiv是父yourDiv，
2. is loading div是html图像

Answer 2

看看这个帖子，它解释了如何显示图像JavaScript loading progress of an image的加载进度