2012-02-21 117 views
3

我有一個目前設置爲無顯示的div,Div有一個大約5000px寬,2000px高的背景圖像。用jQuery預加載背景圖片?

我使用jquery在一個按鈕上切換div顯示attirbute只有在div加載時圖像太大並且圖像在1/2秒後加載時才點擊;有沒有一個功能,我可以顯示預加載器,直到圖像準備好,然後顯示它?

感謝

回答

1

嘗試使用本地JavaScript的Image對象預加載圖像。

另外考慮要避免在網絡上使用如瓷磚等巨大的圖像。

4

這個問題被張貼了一段時間回來,回答只用香草的JavaScript,但可以很容易地適應您的方案。

Preloading CSS Images

$(document).ready(function() { 

    var c = new Image(); 

    c.onload = function(){ 
     $("#Your Div ID").css("background-image", "url(Path to Background Image)"); 
    } 

    c.src = "Path to Background Image"; 

}); 
+0

你能解釋一下這是如何工作究竟賈斯汀? – Liam 2012-02-21 15:37:54

+1

只需爲圖像加載時創建事件處理程序,即可將圖像應用於div作爲背景。在你的情況下,你需要把它變成一個函數,在這個函數中你首先顯示你的預加載器,然後執行上面的代碼以顯示可用的圖像(並隱藏你的預加載器)。有關圖像對象的更多詳細信息:http://www.w3schools.com/jsref/dom_obj_image.asp – JustinW 2012-02-21 15:41:47