2013-06-25 66 views
2

我正在使用xml讀取圖像滑塊的所有圖像標記,我想要加載所有基本上它們都是背景圖像屬性的div。我想加載頁面加載所有背景圖像。預加載div的所有backgorund圖像

$.get('photos.xml', function(xml) { 
       $('item', xml).each(function (k) { 
        frontimg.push($(this).find('frontImg').text()); 
        frontText.push($(this).find('frontTxt').text()); 
        fTitle.push($(this).find('title').text()); 
        fCity.push($(this).find('city').text()); 
        fYear.push($(this).find('compYear').text()); 
        fLoc.push($(this).find('loc').text()); 
        fType.push($(this).find('type').text()); 
        fRole.push($(this).find('role').text()); 
        arrBackImg.push($(this).find('backImg').text());  
        backText.push($(this).find('backTxt').text()); 

        frontDiv.push("<h2>"+fTitle[k]+"</h2>"+ "<h3>"+fCity[k]+"</h3><hr><h4>YEAR OF COMPLETION</h4>"+fYear[k]+"<hr><h4>LOCATION</h4>"+fLoc[k]+"<hr><h4>PROPERTY TYPE</h4>"+fType[k]+"<hr><h4>MAPLETREE'S TYPE</h4>"+fRole[k]); 


        $('#myImageFlow').append('<div id="id'+k+'" alt="div'+k+'" class="sliderImage" width="300" height="350" style="visibility:hidden"> <div class="frontText" id="f'+k+'">'+frontDiv[k]+'</div><div class="borderdiv"></div><div class="reflection" id="ref'+k+'"></div> <div class="overlay"></div></div>'); 


       }); 
     }); 

如何預先加載div的所有背景圖片。

+0

http://stackoverflow.com/questions/476679/preloading-images-with-jquery?rq=1 – Andreas

+0

@Andreas我沒有的img標籤 – anam

回答

0

試試這個:

var $img = $('<img src="' + src + '">'); 
$img.bind('load', function(){ 
    $('.yourDiv').css('background-image', 'url(' + src + ')'); 
}); 
if($img[0].width){ $img.trigger('load'); }