replace img src path - resize window MK2

by ian_smithz

HTML

<img class="ib_img swap lazyload" src="http://localhost:8080/assets/img/image-banners/lg/Ronseal.jpg">

JavaScript

function checkResolution() {
    // Resolution width > 1024px
    if ($(window).innerWidth() > 1024) {
        replaceImagePaths("lg");
    }
    // Resolution width 641px - 1023px
    else if ($(window).innerWidth() >= 641 && $(window).innerWidth() <= 1023) {
        replaceImagePaths("md");
    }
    // Resolution width < 640px
    else if ($(window).innerWidth() <= 640) {
        replaceImagePaths("sm");
    }
}


function replaceImagePaths(resolution) {
    // Switch images
    $('img.swap').each(function(){
        var imagePath = $(this).attr('src');

        $(this).attr('src', imagePath.replace(/sm|md|lg/, resolution));//with the right regex you can do it all in one
    console.log(resolution);
    });
}

$(window).resize(function() {
    checkResolution();
});

$(function(){
    checkResolution();
});