Usando um carregador de imagem de fundo

Você está tentando verificar se uma imagem de fundo foi carregada definindo uma imagem de fundo na tag body e então usando a função load(). No entanto, essa abordagem não funciona de maneira eficaz para imagens de fundo.

Para realmente garantir que a imagem de fundo foi completamente carregada, você pode utilizar uma técnica diferente:

$('<img/>').attr('src', 'http://picture.de/image.png').on('load', function() {
   $(this).remove(); // prevent memory leaks
   $('body').css('background-image', 'url(http://picture.de/image.png)');
});

Este método cria uma nova imagem na memória e anexa um ouvinte de evento de carregamento a ela. Depois que a imagem é carregada, o evento de carregamento é acionado e a imagem de fundo é definida na tag body.

No Vanilla JavaScript, isso pode ser implementado como:

var src = 'http://picture.de/image.png';
var image = new Image();
image.addEventListener('load', function() {
   body.style.backgroundImage = 'url('   src   ')';
});
image.src = src;

Você também pode criar uma função abstrata para lidar com o carregamento da imagem e retornar uma promessa:

function load(src) {
    return new Promise((resolve, reject) => {
        const image = new Image();
        image.addEventListener('load', resolve);
        image.addEventListener('error', reject);
        image.src = src;
    });
}

const image = 'http://placekitten.com/200/300';
load(image).then(() => {
   body.style.backgroundImage = `url(${image})`;
});

Essa abordagem permite verificar com segurança a conclusão do carregamento da imagem de fundo e garante que o código só seja executado quando a imagem estiver totalmente carregada.