preload all backgorund images of div

Question

i am using xml to read all images tag for image-slider, i want to load all the basically they are div with background-image property . i want to Load all background-images on page load .

$.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>');


                });
        });

how to preload all background images of div.

http://stackoverflow.com/questions/476679/preloading-images-with-jquery?rq=1 — Andreas, Jun 25 '13 at 09:54

score 0 · Answer 1 · answered Jun 25 '13 at 09:52

0

try this :

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

answered Jun 25 '13 at 09:52

Falguni Panchal

8,873
3
27
33

preload all backgorund images of div

1 Answers1