如何在后台預加載圖像

Question

使用ajax，我得到了一組圖像URL，創建ul列表並將其添加到頁面。 之后，我打開“ Photoswipe”滑塊以顯示這些圖像。 電話（ipod，htc）上出現問題：圖片沒有時間加載。 有沒有辦法在打開滑塊之前將所有圖像加載到某個地方？

Answer 1

您可以在頁面加載時創建Image對象，這將導致從遠程服務器檢索圖像並將其存儲在瀏覽器緩存中而不顯示在頁面上。 當您在引用同一遠程圖像的頁面上包含和<img>元素時，將從瀏覽器緩存中提供該元素，並立即或多或少地顯示該元素：

new Image().src = 'http://myserver.com/myimage.jpg';
...
<img src="http://myserver.com/myimage.jpg" />

無需保存對Image對象的引用，只需分配如圖所示的src屬性就足以使它們被瀏覽器緩存。