jquery - 我如何使用类在 div 上预加载多个背景图像

Question

使用 jQuery 使用类在 div 上预加载背景图像的最佳方法是什么？

<div id="wrapper" class="first">

</div>


.first {background:url(/image.jpg) repeat-x top center}

Answer 1

只需将它们作为常规图像预加载，使用 Image 对象或隐藏 DIV 中的 IMG 标签。然后，当您将工作 DIV 的类更改为具有您预加载图像之一的 CSS 背景的类时，它将从客户端缓存中提取它。

.preload { display: none; }
...
<div>
    <img src="a.png" class="preload" />
    <img src="b.png" class="preload" />
</div>