<img data-src="/path/to/image.jpg" alt="">

img {

opacity: 1;

transition: opacity 0.3s;

}

img[data-src] {

opacity: 0;

}

[].forEach.call(document.querySelectorAll('img[data-src]'), function(img) {

img.setAttribute('src', img.getAttribute('data-src'));

img.onload = function() {

img.removeAttribute('data-src');

};

});