0 Пользователей и 1 Гость просматривают эту тему.
  • 20 Ответов
  • 1110 Просмотров
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Проблема с прелоадером
« : 07.08.2021, 19:27:48 »
Здравствуйте!
На странице, которая долго загружается (из-за выборки для селекта из БД) я создала прелоадер, руководствуясь
https://itchief.ru/javascript/preloader
Но у меня почему-то такой прелоадер  просто мелькает перед окончанием загрузки. Не могу понять причину.
Буду благодарна за совет.
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #2 : 07.08.2021, 20:16:13 »
здра.
и опять без ссылки на проблемную страницу...
ясновидцев в этом сезоне не завезли
Вот http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest
*

sivers

  • Живу я здесь
  • 2453
  • 333 / 0
Re: Проблема с прелоадером
« Ответ #3 : 07.08.2021, 21:11:58 »
Так ведь долго грузится самая первая страница - на которой и прелоадер прописан. Пока страница не загрузится, то и он не отобразится. Чтоб работало - надо загружать страницу без данных, а форму подгружать аяксом после загрузки страницы (с прелоадером).
На связи в telegram @sivers
sivers @ inbox . ru
https://sivers.su/
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #4 : 07.08.2021, 21:26:07 »
ну да.
т.е. у вас изначально должна открываться пустая страница на которой js-скриптом идет обращение к другой станице, которая собирает форму.
например, создаете пустую статью, в неё вставляете модуль с аяксом, который обращается к
Код
http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest
и после получения данных их выводит и по успешному ответу скрывает прелоадер.
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #5 : 07.08.2021, 21:33:48 »
с такими параметрами передавайте страницу для загрузки и будет получено только содержимое зоны компонента, без меню и всяких футеров
Код
http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest?tmpl=component
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #6 : 07.08.2021, 21:44:11 »
с такими параметрами передавайте страницу для загрузки и будет получено только содержимое зоны компонента, без меню и всяких футеров
Код
http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest?tmpl=component
Спасибо. Теперь мне надо понять, как это запрос сделать.
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #8 : 07.08.2021, 22:52:01 »
гуглится по "аякс запрос"
Вот  условно "пустая" страница:
Спойлер
[свернуть]
И вот результат
http://web.nioch.nsc.ru/lokalnye-normativnye-akty-obrazovatelnoj-organizatsii
Сначала появляется прелоадер, потом он "затухает" и через некоторое время появляется нужная страница.
[/quote]
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #9 : 07.08.2021, 22:55:22 »
Так ведь долго грузится самая первая страница - на которой и прелоадер прописан. Пока страница не загрузится, то и он не отобразится. Чтоб работало - надо загружать страницу без данных, а форму подгружать аяксом после загрузки страницы (с прелоадером).

Спасибо Вам.
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #10 : 07.08.2021, 23:11:06 »
просто перенесите код, отвечающий за скрытие прелоадера внутрь условия получения ответа от аякса.
т.е. чтобы скрытие происходило не в момент загрузки текущей страницы, а после получения ответа от аякса.

берет то, что внутри  без самой функции, т.к. она запускается в момент загрузки пустой страницы, а вам это не нужно
Код
window.onload = function () {
}

и переносите в место, где у вас происходит вставка ответа аякса в документ.
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #11 : 07.08.2021, 23:30:39 »
просто перенесите код, отвечающий за скрытие прелоадера внутрь условия получения ответа от аякса.
т.е. чтобы скрытие происходило не в момент загрузки текущей страницы, а после получения ответа от аякса.

берет то, что внутри  без самой функции, т.к. она запускается в момент загрузки пустой страницы, а вам это не нужно
Код
window.onload = function () {
}

и переносите в место, где у вас происходит вставка ответа аякса в документ.
Вот так сделала, но результат тот же.
Спойлер
[свернуть]
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #12 : 07.08.2021, 23:33:24 »
Все-таки class loaded у body появляется гораздо раньше, чем происходит загрузка
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #13 : 07.08.2021, 23:39:40 »
ну так вы сделали безусловный запрос на вставку содержимого.
у вас же нет никакого обработчика на событие загрузки внешнего контента сейчас.
сделайте хотя бы в таком виде
Код
$('#remoteContainer').load('http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest?tmpl=component', function() {
тут код скрытия
});
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #14 : 07.08.2021, 23:48:03 »
вообще, по хорошему надо именно аякс-запрос использовать, чтобы обработать и ошибки тоже.
иначе в случае сбоя у вас неопределенная ситуация возникает и юзер будет грустно наблюдать вечный прелоадер.
т.е. вам и в момент ошибки надо будет прописывать скрытие прелоадера и показ сообщения, что мол "что-то пошло не так, попробуйте позже"
вот тут пример последний посмотрите.
Код
https://snipp.ru/jquery/ajax-jquery
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #15 : 08.08.2021, 00:11:53 »
Может я ошиблась, следуя вашим предыдущим инструкциям:
<script>
 $(document).ready(function(){

   $('#remoteContainer').load('http://web.nioch.nsc.ru/nioch/razdel-vnutrennij/mytest?tmpl=component', function() {
 
    document.body.classList.add('loaded_hiding');
    window.setTimeout(function () {
    document.body.classList.add('loaded');
    document.body.classList.remove('loaded_hiding');
    }, 500); 
   });
});
</script>
Но сейчас именно безостановочно крутятся шарики.
Конечно, посмотрю.


*

sivers

  • Живу я здесь
  • 2453
  • 333 / 0
Re: Проблема с прелоадером
« Ответ #16 : 08.08.2021, 00:34:41 »
Может я ошиблась
со способом решения проблемы )

Может стоило бы разобраться, почему выборка идет так долго и исправить это? Не придется тогда скрипты прикручивать, в которых вы слегка "плаваете" и вообще результат будет лучше.
На связи в telegram @sivers
sivers @ inbox . ru
https://sivers.su/
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #17 : 08.08.2021, 06:56:09 »
по ходу, в таком варианте не срабатывает скрипт.
так что надо аяксом делать, как и говорилось изначально.
и из полученного результата брать только узел #InitialPrepare, иначе много мусора на странице, включая дубль прелоадера.
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #18 : 08.08.2021, 13:20:15 »



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

Добрый день.
Вот что сделала:
Спойлер
[свернуть]
</script> 
Прелоадер как надо покрутился, но данные, которые надо было загрузить, на странице не появились. Ещё и меню стало не кликабельным.

*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Проблема с прелоадером
« Ответ #19 : 08.08.2021, 14:22:39 »
как-то слишком тяжело вам помочь, извините.
предполагается, что вы должны изучать примеры и вникать в то, что делаете.
сейчас ситуация, когда помогающий должен полностью написать рабочий код для вашего сайта.
добейтесь сначала, чтобы выводило данные аякса, потом уже прелоадер прикручивайте в версии без тайминга - начните с простого.
у вас в коде идет попытка вставить некое
data, которое нигде не получено
в примере же
Код
success: function(data)
а у вас в коде - что?
*

GuDeVic

  • Захожу иногда
  • 228
  • 0 / 0
Re: Проблема с прелоадером
« Ответ #20 : 08.08.2021, 14:50:46 »
У меня вот:
Спойлер
[свернуть]
Заработало. спасибо
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Проблема с 404 страницей

Автор prog5

Ответов: 4
Просмотров: 517
Последний ответ 20.03.2024, 13:16:30
от sivers
Проблема вебвизором в Яндекс метрике при использовании плагина jch optimize

Автор polezniy

Ответов: 32
Просмотров: 2659
Последний ответ 01.03.2024, 10:26:31
от Vastriet
Проблема с кэшем сайта - приходится дважды обновлять страницу

Автор LuNa82

Ответов: 8
Просмотров: 583
Последний ответ 22.02.2023, 12:26:36
от sivers
Проблема с адаптацией сайта для мобильной версии

Автор chen

Ответов: 0
Просмотров: 424
Последний ответ 24.01.2023, 10:21:23
от chen
Проблема с рекламой

Автор Sleepwalker

Ответов: 11
Просмотров: 416
Последний ответ 16.12.2022, 16:39:12
от marksetter