Я пытаюсь создать preloader, но когда я запускаю это, консоль отображает это:

нагруженный[объект HTMLImageElement] из 5

из этой строки кода

console.log('Loaded ' + images[i] + ' of ' + images.length);

Но в идеале я хочу, чтобы это отображалось:

"Загружен 1 из 5"

Как я могу это исправить? Я просто хочу создать это как обратный вызов, чтобы я знал, когда все изображения в определенной панели загружены.

$(panel).each(function(){

    // Find Panel
        var panelId = $(this).attr('id');
        console.log('Loading ' + panelId);  

    // Find Images
        var images = $(this).find('img');
        var path = images.attr('src');
        console.log('Total of ' + images.length + ' Images');

    // Preload Images
        for( i= 0; i < images.length; i++ ) {

            images[i] = new Image();
            images[i].src = path;
            images[i].onload = function(){
                console.log('Loaded ' + images[i] + ' of ' + images.length);
            };

        }

    // End

});

Также - Как я мог изменить мойeach() цикл, чтобы проверить каждую панель, после того, как предыдущая панель закончила проверку?

Любая помощь будет отличной. Благодарю.