在我的网站上有一个网页，其中有 100 张图片，从浏览器一次加载一张图片是不雅观的。
有没有办法让它更优雅、更美观？
最佳答案
你可以 Lazy Load图像，这意味着它们仅在浏览器上显示时才加载。这只需使用以下内容即可:
$("img.lazy").lazyload();
但是，如果在页面加载时可见的图像文件非常大，则您无能为力。
我以前使用过的一个让用户更友好的想法是将每个 img 元素放在 div 中，它有一个 ajax loader 的背景图像。 .这至少给人一种正在加载某些东西的感觉。然后，一旦图像被加载，这将覆盖正在加载的图像。
编辑:看到你的 latest comments ，如果您使用非常小的图像，如 @afaf12已经指出，使用CSS Sprites将是一个合适的解决方案。许多大型网站，包括 StackOverflow，都使用这些。这意味着不是为所有图像发出 100 个 HTTP 请求，而是发出 1 个 HTTP 请求(即 1 个图像下载)，然后使用 CSS 将此图像定位在不同的位置。
有各种不同的CSS Sprite generators也可用于防止您自己完成这项艰巨的任务:
关于javascript - 在一页中加载 100 张图像的最佳方法？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10735366/