javascript - Jquery Fade in background-image on dynamically created div -


i've searched everywhere, can't seem find answer this... i'm looking way check if dynamically created div's background image has loaded.

i have built photo gallery first makes ajax call , creates divs background images display thumbnails of photos in gallery. can check out here: http://www.aslamhusain.com/design.php#id=set_allison_basha

i find way fadein each div when loads, can't find way check if background image has loaded. possible? appreciated! first time posting here, site has been lifesaver me!! in advance,

here code:

if($("#"+gallery_id).length<=0){                   $.ajax({                     url: "get_photos.php?gallery="+gallery,                     success: function(data){                         //create gallery div                        $("#wrapper").append("<div class='page' id='"+gallery_id+"'><h2>"+gallery+"</h2></div>")                         //sort ajax data                         window.pic_array = data.split("***");                         var total_images = window.pic_array.length - 1;                         for(i=0;i<total_images;i++){                             var pic_data = window.pic_array[i].split("|")                             var date = pic_data[0] ;                             var comment = pic_data[1];                             var photo = pic_data[2];                             var width = pic_data[3];                             var height = pic_data[4]                             var new_div = $("<div/>", {                                  id: "image_"+i,                               class: "thumbnail_div",                               click: function("float_image('"+i+"')"),                                 css: {                                   backgroundimage: "url(thumbs/"+photo+")",                               }                            })                            new_div.appendto($("#"+gallery_id))                         }                     }                   });               } 

this plugin can usefull. provides useful callbacks once descendant images have loaded.

https://github.com/alexanderdickson/waitforimages

$('selector').waitforimages({     finished: function() {         // called once descendent images have loaded     },     each: function() {        // called each image loaded     },     waitforall: true // check images referenced in css (background-image, list-style-image, border-image, border-corner-image) }); 

Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -