JSFiddle - React, Tailwind, and code Playground

by adouga

HTML

<div id="container"><img id="mainImage" data-src="http://photos.smugmug.com/photos/344291068_HdnTo-1000x1000.jpg"></div>

JavaScript

function setImageSize() {
    var width = $("#container").width();
    var img = $("#mainImage");
    img.width(width);
    img.attr("src", img.data("src").replace(/1000x1000/, width + "x" + width));
}

(function() {
    var pauseTimer;

    $(window).resize(function() {
        // clear any previous timer running
        if (pauseTimer) {
            clearTimeout(pauseTimer);
        }
        // set new timer
        pauseTimer = setTimeout(function() {
            pauseTimer = null;
            setImageSize();
        }, 500);
    })
})();
    
    
    
$(document).ready(function() {
    setImageSize();
});