循環通過一組無數循環中的jQuery的圖像？

我有這樣的jQuery的圖像循環儀，做以下操作：循環通過一組無數循環中的jQuery的圖像？

預載多張圖像（如50？）
從這些40每次
騎車他們選擇隨機分配其中的14至14個div的永遠的

什麼是最好的方式來循環14個圖像，得到一個隨機圖像分配給每個14格？

編輯： AJAX調用像我的第一個解決方案似乎是一個愚蠢的想法（在服務器上高負載是否有上百頁開），所以預先緩存似乎是一個更好的選擇。

EDIT2：改寫了問題，更精確和清晰

我發現預緩存這個偉大的方法：

var images = [ 
    '/path/to/image1.png', 
    '/path/to/image2.png' 
]; 

$(images).each(function() { 
    var image = $('<img />').attr('src', this); 
});

我的老電流法：

$("#hi1").load('/get_img'); 
    $("#hi2").load('/get_img'); 
    $("#hi3").load('/get_img'); 
    ... etc till 14 

    var refreshId = setInterval(function() { 
     $("#h1").load('/get_img'); 
     $("#h2").load('/get_img'); 
     $("#h3").load('/get_img'); 
     }, 4000); 
     $.ajaxSetup({ cache: true }); 
    })

來源

2012-10-11 Rubytastic

你是什麼意思，「永遠騎自行車」？不知何故與每4秒加載一次新圖像相矛盾。 – dokaspar

總共有14個圖像，還是'/ get_img'從大池中返回一個新的隨機圖像？ – CWSpear

@CWSpear是的，有14個圖像通過get_image函數從較大的池中返回 – Rubytastic

你可以在AJAX中返回源代碼並創建<img>並設置src，然後如果不需要，請隱藏它，以便返回該圖片再次，您可以取消隱藏它，而不是再次加載它。您可以檢查圖像是否存在類似的東西：

$('img[src="' + src + '"]').length > 0;

如果這是真的，那麼它存在，所以只顯示它。如果不是，則將該圖像加載到DOM中。不需要時只需隱藏圖像。

來源

2012-10-11 06:35:37 CWSpear

你可以在你的代碼中做一件事。

$("#hi1").load('/get_img'); 
    $("#hi2").load('/get_img'); 
    $("#hi3").load('/get_img'); 

    var refreshId = setInterval(function() { 
     $("#h1").load('/get_img').hide().delay(4000).show(); 
     $("#h2").load('/get_img').hide().delay(4000).show(); 
     $("#h3").load('/get_img').hide().delay(4000).show(); 
     }, 0); 
     $.ajaxSetup({ cache: true }); 
    })

所以一旦dom準備就緒，它會加載圖像，並立即隱藏它。然後在延遲4秒後顯示內容。

來源

2012-10-11 06:36:01

循環通過一組無數循環中的jQuery的圖像？

回答

相關問題