Hey, be lazy! bLazy.JS is a lightweight pure JavaScript script for lazy loading and multi-serving images. It's working in all modern browsers including IE7+.
Hi your plugin is awesome. Question, we have so weird cases where the 'data-src' images won't load (we just see the 'src' placeholder).
First I tried to add the success / fail to see the magnitude of the occurrences (we track js errors):
success: function (ele) { console.log('loaded'); } , error: function (ele, msg) { if (msg === 'missing') { console.error('blazy missed loading image'); } else if (msg === 'invalid') { console.error('blazy encountered an invalid image'); } }
but found that the non loading images doesn't seem to trigger an actual error. So now I'm adding 'bLazy.revalidate();' in a hope to completely get rid of any issues. The full code now looks like this:
function bLazyInitiate() { var bLazy = new Blazy({ breakpoints: [{ width: 703 // max-width , src: 'data-src-small' }], success: function (ele) { console.log('loaded'); } , error: function (ele, msg) { if (msg === 'missing') { console.error('blazy missed loading image'); } else if (msg === 'invalid') { console.error('blazy encountered an invalid image'); } } }); bLazy.revalidate(); } //$(window).load(function () { // bLazyInitiate(); //}); $(function () { bLazyInitiate(); });
Do you think this is a good strategy and/or is the code solid?
Hi your plugin is awesome. Question, we have so weird cases where the 'data-src' images won't load (we just see the 'src' placeholder).
First I tried to add the success / fail to see the magnitude of the occurrences (we track js errors):
success: function (ele) { console.log('loaded'); } , error: function (ele, msg) { if (msg === 'missing') { console.error('blazy missed loading image'); } else if (msg === 'invalid') { console.error('blazy encountered an invalid image'); } }
but found that the non loading images doesn't seem to trigger an actual error. So now I'm adding 'bLazy.revalidate();' in a hope to completely get rid of any issues. The full code now looks like this:function bLazyInitiate() { var bLazy = new Blazy({ breakpoints: [{ width: 703 // max-width , src: 'data-src-small' }], success: function (ele) { console.log('loaded'); } , error: function (ele, msg) { if (msg === 'missing') { console.error('blazy missed loading image'); } else if (msg === 'invalid') { console.error('blazy encountered an invalid image'); } } }); bLazy.revalidate(); } //$(window).load(function () { // bLazyInitiate(); //}); $(function () { bLazyInitiate(); });
Do you think this is a good strategy and/or is the code solid?