Javascript-форум - отображение размера html страницы

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - отображение размера html страницы (https://javascript.ru/forum/events/29993-otobrazhenie-razmera-html-stranicy.html)

отображение размера html страницы

Доброго времени суток.
Меня интересует реализация прелодера к html странице с отображением загруженных байт, но гугл и поиск по форуму мне не помогли...
Я кодить на JavaScript не умею и вообще для меня он похож на ActionScript, причем как и названием так и содержимым, проводя такую ассоциативную цепочку мне в голову взбрело, что в JS есть событие на подобие OnGetBytes как в AS, конечно это может быть моя больная фантазия...
Хотелось бы услышать, если это так и почему так нельзя или как можно, заранее спасибо

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

Ну ежли в начале страницы в заголовке писать общий размер - можно процентный прогрессбрар соорудить - а так чисто байты - вродь ни о чём не информируют

размер контента будет писаться в Context-Length, как получить инфу о HTTP ответе с помощью JS?

maloun365,
Приведите пример заголовка включая хидер

Deff,
HTTP/1.1 200 OK
Content-Length: %d
или это не то? выразитесь яснее

Пример:

*!*
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru" dir="ltr">
<head>
*/!*
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<meta name="google-site-verification" content="v9Kpfc51FlFjvXEBq1t0zJH__JPx58kMVJWNOYFScLI" />
<meta name="yandex-verification" content="6a5a572f1bb19704" />
<meta name="robots" content="noindex, follow" />
<title>Единый форум поддержки</title>
<link rel="alternate" type="application/rss+xml" href="http://forum.mybb.ru/export.php?type=rss" title="RSS" />
<link rel="top" href="http://forum.mybb.ru" title="" />
<link rel="search" href="http://forum.mybb.ru/search.php" title="Поиск" />
<link rel="author" href="http://forum.mybb.ru/userlist.php" title="Участники" />
<!--/noindex-->
<link rel="stylesheet" type="text/css" href="http://forum.mybb.ru/style/Mybb_Bend/Mybb_Bend.css" />
</head>

Интересует - Красное

Суть в том - что отловить заголовок посылки на страницы браузера с размером контента - ява-скриптом - вряд ли возможно(это можно при лишь при аякс запросе) - поэтому размер должен быть где-то явно прописан в теге, в самом начале страницы, либо заранее дано - что страница подгружается аяксом

Deff,

<html>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<head>

понял, если передавать контент через chunk'и я смогу прочитать хидер до полной загрузки?

и как потом считать байты по мере скачивания?

Цитата:

Сообщение от maloun365

chunk'и

:blink: Мну профан в серверной части -
Короче для обычной браузерной страницы желательно проставить
метатег такого плана:
<meta name="length" content="20700" />
Где красное - объем страницы

Deff,
это позволит узнать размер страницы, а как считать байты по мере их загрузки?

Цитата:

Сообщение от maloun365

это позволит узнать размер страницы, а как считать байты по мере их загрузки?

Считать байты проще - ставим таймер - периодически считывающий

document.body.parentNode.innerHTML.split('').length

а почему не сделать подобную анимацию загрузки

<!DOCTYPE HTML>
<html>
  <head> 
  <style>
    
    body {
background: #161616 url(http://www.alessioatzeni.com/wp-content/tutorials/html-css/CSS3-loading-animation-loop/pattern_40.gif) top left repeat;
margin: 0;
padding: 0;
font: 12px normal Verdana, Arial, Helvetica, sans-serif;
height: 100%;
}
    .ball {
	background-color: rgba(0,0,0,0);
	border:5px solid rgba(0,183,229,0.9);
	opacity:.9;
	border-top:5px solid rgba(0,0,0,0);
	border-left:5px solid rgba(0,0,0,0);
	border-radius:50px;
	box-shadow: 0 0 35px #2187e7;
	width:50px;
	height:50px;
	margin:0 auto;
	-moz-animation:spin .5s infinite linear;
	-webkit-animation:spin .5s infinite linear;
}
.ball1 {
	background-color: rgba(0,0,0,0);
	border:5px solid rgba(0,183,229,0.9);
	opacity:.9;
	border-top:5px solid rgba(0,0,0,0);
	border-left:5px solid rgba(0,0,0,0);
	border-radius:50px;
	box-shadow: 0 0 15px #2187e7; 
	width:30px;
	height:30px;
	margin:0 auto;
	position:relative;
	top:-50px;
	-moz-animation:spinoff .5s infinite linear;
	-webkit-animation:spinoff .5s infinite linear;
}
@-moz-keyframes spin {
	0% { -moz-transform:rotate(0deg); }
	100% { -moz-transform:rotate(360deg); }
}
@-moz-keyframes spinoff {
	0% { -moz-transform:rotate(0deg); }
	100% { -moz-transform:rotate(-360deg); }
}
@-webkit-keyframes spin {
	0% { -webkit-transform:rotate(0deg); }
	100% { -webkit-transform:rotate(360deg); }
}
@-webkit-keyframes spinoff {
	0% { -webkit-transform:rotate(0deg); }
	100% { -webkit-transform:rotate(-360deg); }
}
    .load{
      margin:50px;
    
    }   
    </style>
  
  </head>
  <body>
<div class ='load'>
    <div class="ball"></div>
<div class="ball1"></div>
    </div>
  </body>
</html>

и по window.onload или DOMContentonload показывать страницу?

cyber,
а что кроме вебкит и мозилы других браузеров не бывает? например опера с префиксом -o- хорошо работает с анимацией, а точнее анимация в опере реализована на 99.9% да и обычное w3c стандартное без префиксов писать не забывать нужно...

эта анимация была для примера можно юзать гифку