Как мне создать предварительный загрузчик jQuery с процентным счетчиком?

Question

Я написал этот код, который я узнал из книги для начинающих jQuery, которая прекрасно работает в качестве предварительного загрузчика для страницы, но как мне создать счетчик процентов (%) для него?- На основании того, сколько загружено содержимое тела?На данный момент у меня есть только анимированный GIF, но я бы хотел что-то более продвинутое!:)

// Lets preload!
$(window).load(function() {
  $('#preloader').fadeOut('slow', function() { $(this).remove(); });
});

CSS:

#preloader {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background: #009933 url(uploads/images/ajax-loader2.gif) center center no-repeat;
}

Любая помощь будет принята с благодарностью!

Спасибо.

Answer 1

Вы можете подделать это, например, (например, я использую изображения):

var percentCounter = 0;

$.each(arrayOfImageUrls, function(index, value) {
    $('<img></img>').attr('src', value)    //load image
        .load(function() {
            percentCounter = (index / arrayOfImageUrls.length) * 100;    //set the percentCounter after this image has loaded
            $('#yourProgressContainer').text(percentCounter + '%');
        });
});

Answer 2

Я использовал этот плагин для своего веб-сайта ... может быть, это хорошо и для вас ..

Answer 3

этот плагин jQuery может помочь.