jquery - Bootstrap isotope and lazyload fetch/load images via json -

Using normal isotope for AJAX fetching is working See work.

Problem: does not trigger lazyload and keeps showing the gray image.

Javascript for lazyload setup:

  $ (document) .ready (function () {// // initialize at initialize; / / $ Container.isotope ({item selector: '.box', columnWidth: function (containerwidth) {return containerwidth / 12;}, online: function () {$ win.trigger ("scroll");}}); / / // I'll use the data via API // For now I'm defining Json / var manually Json has been defined at the top of this code / json return / consideration // $. GetJSON (APIUL), Function (JSN) {var new Elements = ""; $ .each (Jason, Function (key, value) {console.log (key); newElements + = '& lt; div class = "box" & gt;' + '& lt; img class = "Lazy" src = "'+ small_img +'" data-base-rs = "'+ value [' image ']' 'width ="' value ['width'] + '"height ="' + value [ 'Height'] + '"" / div> ";}); var $ NewElems = $ (new elements); $ container.apend ($ newelame) .ms loaded (function () {$ C Ontainer.isotope ('enclosed', $ newElems); $ Imgs.lazyload ({container: $ container, effect: "feedin",}). RemoveClass ("Lazy"); $ Imgs.trigger ('book'); }); //}); });    
 
 
 I solved it.  
  Due to failure:   
 
 
  Bootstrap  style = "width: XX; height: XX "In general, to tag width and height parameters in writing on bootstrap, img {} css definitions were one of the problems.  & lt; Img square = "lazy" width = "200" height = "300" style = "width: 200px; height: 300px;" Vars before AJX:  Because I am doing:     
 Using AJAX content, then  var $ imgs = $ ("Img.lazy");  Ajax does not work before the call. So I used $ ("img.lazy") directly to be safe.