如何预加载图片？

Question

我在悬停时使用了大背景图片，这是在css background {....}

中设置的

鼠标悬停时首次加载需要一些时间，因此我想预先加载此background图片。

使用纯css或javascript或jquery执行此操作的最佳选择是什么？

请不要建议我 CSS Sprite 。

Answer 1

您可以查看可能会大幅降低图片大小的CSS sprites技术。顺便说一句，它有助于预加载所有悬停，或动态更改装饰图像，它们已在页面加载时加载。

Answer 2

如果图像始终相同，则以下操作：

pic1= new Image(100,25);
pic1.src="http://someplace.com/image1.gif";

Answer 3

如果是悬停效果，请使用css sprites并忘记javascript。更轻松，更少的http请求。

Answer 4

或者不要这样预装。

让图像包含图像的两种状态，然后使用CSS重新定位图像以显示您想要的状态。

如果您有多个图像，可能值得实现其他人提到的精灵。

另一个链接：http://www.smashingmagazine.com/2009/04/27/the-mystery-of-css-sprites-techniques-tools-and-tutorials/