HTML5进度条 - 浏览器加载大图片

Question

我使用HTML5和CSS创建了大型文件图片的幻灯片页面。问题是它们需要大约一分钟才能加载。如果图片没有完全加载，幻灯片放映将不会转到下一张幻灯片。

我想添加一个用户在后台加载时看到的进度条。

这是代码的基础：

http://tutorialzine.com/2010/09/html5-canvas-slideshow-jquery/

有什么建议吗？

我的JavaScript知识非常有限，这就是我试图找到HTML5和CSS3答案的原因。

Answer 1

一个想法 - 如果你想避免使用JS，然后使用css3将图像侧向旋转，然后裁剪它，使其看起来像一个进度条（你甚至可以添加CSS过滤器使其成为一种颜色）。

当它加载时（由于CSS旋转，从左到右而不是从上到下），它看起来像一个“进度”栏。

没有JS加载时没有真正的提示方法。