JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgit.com/alexanderdickson/waitForImages/master/dist/jquery.waitforimages.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(Math.floor(loaded / total * 100) + '% loaded.');
});