我有一个分层的 div 组件，它通过滑动动画离开顶部图像来显示一系列连续的大 kb 图像以显示下面的下一个图像。我试图了解如何最好地解决这个问题。
方法一：
将多个 div 层叠在一起，每个 div 都分配有一个图像作为背景，并根据需要滑开 div。
隐藏的 div 会在页面加载时加载它们的图像，还是仅在它们被显示时加载？这是浏览器/客户端特定的行为吗？在这方面，所有图像（jpeg、png）的行为方式都相同吗？
方法二：
只使用两个 div - 一个处理滑动，另一个将加载并显示下一个图像。
在这种情况下，是否可以预加载下一张图片，以便在显示下一张图片时 javascript 不会变慢？
谢谢-如果有人有其他想法，我很想听听。
您的第一种方法，即使图像通过 CSS“隐藏”，也会通过 HTTP 请求由所有浏览器加载所有图像。您的第二种方法或它的某种变体可能更好。
我建议您使用 AJAX 来拉下每个图像。绝对可以预加载图像。
您可能需要考虑用于 jquery 或 javascript 的现有幻灯片/灯箱类型的插件。它已经完成了很多次，你会有点重新创造轮子（除非它更像是一种学习经验）..
这是一个有趣的示例，使用回调预加载以在准备好时提醒您。也许是一个很好的适应？
http://binarykitten.me.uk/dev/jq-plugins/107-jquery-image-preloader-plus-callbacks.html
第一种方法肯定会更好地退化。如果在受 CSS 挑战的浏览器上查看，它将使图像可用且可见。但这是以必须从一开始就拉下所有图像为代价的。第二种方法在初始命中时较轻，但代价是增加了代码复杂性，将图像换入/换出。
您绝对可以使用 Javascript 预加载图像。只需创建一个图像对象并将其源设置为您想要的任何内容，这将自动触发图像的下载。不必将其插入 DOM 或对用户可见即可执行此操作。
隐藏的 div应该自动加载它们的内容，无论它们是否可见。我想不出任何基于 PC 的浏览器不会这样做，但我敢猜测，一些用于资源受限设备（手机）的浏览器可能会优化事物并延迟加载内容，直到容器可见，以节省网络流量。