diff --git a/dist/lozad.js b/dist/lozad.js index 83f9e3f..0d6829a 100644 --- a/dist/lozad.js +++ b/dist/lozad.js @@ -1,4 +1,4 @@ -/*! lozad.js - v1.0.9 - 2017-10-26 +/*! lozad.js - v1.0.9 - 2017-12-16 * https://github.com/ApoorvSaxena/lozad.js * Copyright (c) 2017 Apoorv Saxena; Licensed MIT */ @@ -28,7 +28,16 @@ var defaultConfig = { }; function markAsLoaded(element) { - element.setAttribute('data-loaded', true); + var imgLoad = new Image(); + imgLoad.onload = function () { + element.setAttribute('data-loaded', true); + }; + if (element.getAttribute('data-src')) { + imgLoad.src = element.getAttribute('src'); + } + if (element.getAttribute('data-background-image')) { + imgLoad.src = element.getAttribute('data-background-image'); + } } var isLoaded = function isLoaded(element) { diff --git a/dist/lozad.min.js b/dist/lozad.min.js index 4b38e0d..45ffc2b 100644 --- a/dist/lozad.min.js +++ b/dist/lozad.min.js @@ -1,4 +1,4 @@ -/*! lozad.js - v1.0.9 - 2017-10-26 +/*! lozad.js - v1.0.9 - 2017-12-16 * https://github.com/ApoorvSaxena/lozad.js * Copyright (c) 2017 Apoorv Saxena; Licensed MIT */ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.lozad=e()}(this,function(){"use strict";function t(t){t.setAttribute("data-loaded",!0)}var e=Object.assign||function(t){for(var e=1;e0&&(n.unobserve(r.target),o(r.target)||(e(r.target),t(r.target)))})}};return function(){var a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:".lozad",i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},u=e({},r,i),d=u.rootMargin,c=u.threshold,s=u.load,g=void 0;return window.IntersectionObserver&&(g=new IntersectionObserver(n(s),{rootMargin:d,threshold:c})),{observe:function(){for(var e=document.querySelectorAll(a),r=0;r0&&(o.unobserve(r.target),n(r.target)||(e(r.target),t(r.target)))})}};return function(){var a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:".lozad",i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},u=e({},r,i),d=u.rootMargin,c=u.threshold,g=u.load,s=void 0;return window.IntersectionObserver&&(s=new IntersectionObserver(o(g),{rootMargin:d,threshold:c})),{observe:function(){for(var e=document.querySelectorAll(a),r=0;r { + element.setAttribute('data-loaded', true) + } + if (element.getAttribute('data-src')) { + imgLoad.src = element.getAttribute('src') + } + if (element.getAttribute('data-background-image')) { + imgLoad.src = element.getAttribute('data-background-image') + } } const isLoaded = element => element.getAttribute('data-loaded') === 'true' diff --git a/test/index.js b/test/index.js index c74a001..24cd2b9 100644 --- a/test/index.js +++ b/test/index.js @@ -60,8 +60,13 @@ describe('lozad', () => { const observer = lozad() const image = document.getElementsByTagName('img')[0] observer.observe() - assert.equal('true', image.dataset.loaded) - assert.equal(image.getAttribute('src'), image.dataset.src) + const imgLoad = new Image() + imgLoad.onload = () => { + image.setAttribute('data-loaded', true) + assert.equal('true', image.dataset.loaded) + assert.equal(image.getAttribute('src'), image.dataset.src) + } + imgLoad.src = image.getAttribute('src') }) }) @@ -81,8 +86,12 @@ describe('lozad', () => { const image = document.getElementsByTagName('img')[0] image.setAttribute('class', className) observer.observe() - assert.equal('true', image.dataset.loaded) - assert.equal(image.getAttribute('src'), image.dataset.src) + const imgLoad = new Image() + imgLoad.onload = () => { + image.setAttribute('data-loaded', true) + assert.equal('true', image.dataset.loaded) + assert.equal(image.getAttribute('src'), image.dataset.src) + } }) })