javascript - 优化jsp页面图片加载

Question

我有一个登录页面，其中有一个大约“900KB”的图像，并且需要一些时间才能显示，因此整个页面不会显示。有没有办法至少首先显示登录ID和密码输入字段。

是否有任何 jquery 插件可用于显示浏览器上渲染图像的进度。

Answer 1

我刚刚完成测试并欣赏以下 jQuery 插件 jQuery Lazy .

这是满足您需求的简单解决方案。

$("img.lazy").Lazy({
  combined: true,
  delay: 3000
});

img.lazy {
  width: 700px;
  height: 467px;
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/0.6.4/jquery.lazy.min.js"></script>
<!--
  use the data-src attribute and not the src!!!
-->
<img class="lazy" data-src="http://pngimg.com/upload/bicycle_helmet_PNG9846.png" src="" />