javascript: время до загрузки страницы

Question

Я пишу анимацию с javascript и хочу печатать до времени загрузки пользователя, пока все изображения не будут загружены.

набор изображений в HTML как: <img src="" />

есть код Javascript, чтобы знать, когда все страницы загружаются?
то время, пока OnLoad() событие называется

Answer 1

Вы могли бы быть в состоянии сделать что-то вроде этого в нижней части страницы

<span id="imgsMsg"></span> 
<script type="text/javascript"> 
var imgs = document.images; 
var len = imgs.length; 
var percent = 100; 
var count=0; 
var messagecontainer = document.getElementById("imgsMsg"); 
for (var i=0;i<len;i++) { 
    imgs[i].onload=function() { 
    count++; 
    messagecontainer = (percent - Math.floor((100/len)*count))+"% loaded"; // hope my math is correct ;) 
    } 
} 
</script> 
</body> 

Answer 2

Это не трудно сделать, с $(window).load:

var readytime = new Date().getTime(); 
$(window).load(function() { 
    var loadingtime = (new Date().getTime() - readytime)/1000; // in seconds 

    $('#yourTimingField').text(loadingtime + ' seconds'); 
}); 

Это измеряет количество времени между этой частью сценария и загрузками все подэлементы.

Answer 3

Лучшее, что вы, вероятно, может сделать это, чтобы отслеживать количество изображений, которые были загружены, и разделить, что в общей сложности количество оставшихся изображений. Что-то вроде этого:

var total_loaded = 0; 
$('img').load(function() 
{ 
    total_loaded += 1; 
    var load_progress = total_loaded/$('img').length; 
    // you can now use load_progress to show the user a rough progress animation 
}); 

Если вы хотите отображать «оставшееся время», вам нужно подделать его. Вы могли бы отслеживать общее время, прошедшее и сравнивая его с переменной load_progress, чтобы получить, например, оставшееся время.