|
16.06.2015, 20:31
|
|
Кандидат Javascript-наук
|
|
Регистрация: 14.06.2014
Сообщений: 137
|
|
Прелоадер без Jquery
Помогите, пожалуйста, советом.
Не могу никак сообразить как реализовать отсчет цифр от 0 до 100, пока грузится страница.
Сначала пришла идея сделать отсчет от 0 до 100 с определенным интервалом. А интервал пытался вычеслить через window.onload , но в итоге ничего путного не вышло.
В интернете есть куча прелоадеров на Jquery и даже на CSS. Но хочется самому написать на JavaScript
Помогите, пожалуйста, хотя бы советом, что зачем идет.
|
|
16.06.2015, 22:35
|
Профессор
|
|
Регистрация: 31.01.2015
Сообщений: 576
|
|
qwe88, а если так?
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
.preload {
font-size: 3em;
}
</style>
</head>
<body>
<div class="preload"></div>
<iframe src="http://javascript.ru" frameborder="0"></iframe>
<iframe src="http://javascript.ru/forum/" frameborder="0"></iframe>
<iframe src="http://javascript.ru" frameborder="0"></iframe>
<script>
var preload = document.getElementsByClassName('preload')[0], i = 0;
var timer = setInterval(function() {
preload.innerHTML = i++ % 100;
}, 100);
window.onload = function() {
clearInterval(timer);
preload.innerHTML = 'Страница полностью загружена';
};
</script>
</body>
</html>
|
|
16.06.2015, 23:33
|
|
Кандидат Javascript-наук
|
|
Регистрация: 14.06.2014
Сообщений: 137
|
|
Спасибо, но нужно обязательно до 100
|
|
16.06.2015, 23:51
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
Сообщение от qwe88
|
Не могу никак сообразить как реализовать отсчет цифр от 0 до 100, пока грузится страница.
|
никак.
|
|
16.06.2015, 23:58
|
|
Кандидат Javascript-наук
|
|
Регистрация: 14.06.2014
Сообщений: 137
|
|
Делают же прелоадеры процентные на Jquery. А как сделать на JS?
Возможно как-то частями подгружать?
|
|
17.06.2015, 00:12
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
qwe88,
никак, ни на Jquery, ни на JS -- подумайте над чем нибудь другим.
|
|
17.06.2015, 09:00
|
Профессор
|
|
Регистрация: 12.12.2012
Сообщений: 1,398
|
|
qwe88,
Вы можете делать прелоадер и считать процент не от того на сколько страница загружена а от того сколько ваших компонентов загружено. Например я делал игру, в которой было много картинок, которые были необходимы для игры. И я делал прелоадер пока картинки не загрузятся. Получить процент загрузки каждой картинки нельзя (по крайней мере обычным способом), но можно считать процент от количества загруженных картинок. Конечно прелоадер при этом движется не равномерно из за того что картинки разного размера, но это похоже на то, что вам надо.
|
|
17.06.2015, 09:12
|
Профессор
|
|
Регистрация: 12.12.2012
Сообщений: 1,398
|
|
Пример прелоадера одной картинки:
// показать прелоадер
var img = new Image();
img.src = 'image source';
img.onload = function () {
// убрать прелоадер
};
Для большого количества картинок надо обернуть это в цикл и при каждой загрузке увеличивать процент.
|
|
17.06.2015, 09:17
|
|
Кандидат Javascript-наук
|
|
Регистрация: 14.06.2014
Сообщений: 137
|
|
Круто, спасибо огромное!
|
|
|
|