Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / красивый переход, часики и загрузка больших страниц / 4 сообщений из 4, страница 1 из 1
29.09.2018, 16:12
    #39710318
yemets63
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
красивый переход, часики и загрузка больших страниц
как сделать HoursGlass (или всякие вращающиеся точки) пока открывается HTML страница.

есть большие страницы с долгой загрузкой с сервера, секунд 20.
так вот как сделать?
например, щелкаю ссылку на странице 1 и сразу появляются часики, и они исчезают только после полной загрузки страницы 2.

попробовал сам, посмотрел достаточно много скриптов, у меня и везде происходит чуть иначе, идет открытие 2-й страницы выполняются PHP скрипты на стороне сервера и часики появляются только тогда, как начинается отрисовка полученных данных с сервера, а хотелось бы, чтобы отрисовка часиков начиналась с момента нажатия ссылки

сп.
...
Рейтинг: 0 / 0
01.10.2018, 12:59
    #39710876
SQLPowerUser
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
красивый переход, часики и загрузка больших страниц
yemets63а хотелось бы, чтобы отрисовка часиков начиналась с момента нажатия ссылкиМожно скразу показать DIV, где крутится что-то из этого: https://jsfiddle.net/2okc0qbt/ , а при окончании запроса, этот DIV спрятать:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
  function ajax(url, data, callBack) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', url, true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send(data);
    xhr.onload = xhr.onerror = callBack;
  }

  // При клике на ссылку
  myLink.onclick = function(e) {
    show(progressBar);
    var s = 'param1=' + encodeURIComponent(param1) + '&param2=' + encodeURIComponent(param2);
    ajax('app.php', s, showResult);
  }
  function showResult() {
    hide(progressBar);
    console.log(this.responseText);
  }



А ещё можно в iframe выводить напрямую из PHP (через flush) типа такого:
Код: php
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
function test() {
  if (ob_get_level() == 0) ob_start();
  for ($i = 1; $i<=10; $i++){
    echo "<br> i = $i";
    ob_flush();
    flush();
    sleep(1);
  }
  echo "<br> Done.";
  ob_end_flush();
}

$start = microtime(true);
test();
$time = microtime(true) - $start;
printf('<br> Скрипт выполнялся %.4F сек.', $time);
...
Рейтинг: 0 / 0
01.10.2018, 13:25
    #39710892
Petro123
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
красивый переход, часики и загрузка больших страниц
yemets63есть большие страницы с долгой загрузкой с сервера, секунд 20.грузи кусками. Зачем так долго?
...
Рейтинг: 0 / 0
04.10.2018, 10:21
    #39712828
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
красивый переход, часики и загрузка больших страниц
yemets63,

ищем css preloader(какой понравится) Добавляет на страницу

при начале загрузки делаем видимым при окончании прячем!

Вот так както
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / красивый переход, часики и загрузка больших страниц / 4 сообщений из 4, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]