Error loading HTML and JS images

I have programmed my first website and it is a kind of online store. What happens is that the photos I've used have had to be modified so that their size is not the one that should not be, all this with JS.

The problem I have is that, at least on my computer, from time to time the page is loaded before the JS file or suddenly everything is out of control and the images of the products become disoriented. I leave the web so you can see it, see if it happens, reloading the page. I recommend you to enter the Sunglasses section, that's where it looks best: link

I have the JS file in the body, under everything, and inside it I have the code inside

(function(){
    'use strict';
    document.addEventListener('DOMContentLoaded', function(){
        ...
    })
});

Any idea what the problem is?

Thank you very much.

PS: If you modify the size of the page, it gets better.