CSS object-fit to background-image fallback // IE11

objectFitFix.js

// Detect objectFit support
// set full size img to selected container as background
// especially for IE11

module.exports = () => {
    if ('objectFit' in document.documentElement.style === false) {
        // assign HTMLCollection with parents of images with objectFit to variable
        const container = document.getElementsByClassName('js-sliderImg');

        // Loop through HTMLCollection
        for (let i = 0; i < container.length; i += 1) {
            // Asign image source to variable (lazyload data-src !!)
            const imageSource = container[i].querySelector('img').getAttribute('data-src');
            container[i].querySelector('img').style.display = 'none';
            container[i].style.backgroundSize = 'cover';
            container[i].style.backgroundImage = `url(' ${imageSource} ')`;
            container[i].style.backgroundPosition = 'center center';
        }
    }
};