JSFiddle - React, Tailwind, and code Playground

by Raul Corona Xolaltenco

HTML

<script src="https://raw.github.com/alexanderdickson/waitForImages/master/dist/jquery.waitforimages.min.js"></script>
<span></span>

JavaScript

// Always check out the latest version from
// https://github.com/alexanderdickson/waitForImages

// Make a bunch of images that our browser has to download for this example.
for (var j = 0; j < 20; j++) {

    $('<img />', {
        'alt': '',
        'src': 'http://lorempixel.com/100/100?' + Math.random()
    }).appendTo('body');

}

// Test plugin
$('body').waitForImages(

function() {
    $(this).append('<p>Images loaded.</p>');
}, function(loaded, total) {
    $(this).css({
        border: '1px solid #ccc'
    });
    $('span').html(parseInt(loaded / total * 100) + '% loaded.');
});