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

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Кракая инструкция по добавлению в шаблон "Индикатора загрузки" - т.е. маленького окошечка, демонстрируемого пользователю, пока грузится сайт (использованы исходники от d4).

1. Открываем файл index.php шаблона
2. В любом месте между тегами <head> и </head> добавляем код:
Код
<script type="text/javascript">
function hideLoading() {
document.getElementById('pageIsLoading').style.display = 'none';
}
</script>
3. Сразу после тега <body> добавляем код:
Код
<div id="pageIsLoading"
style="
position:          absolute;
display:            block;
padding-left:    44px;
padding-right:  12px;
width:             auto;
height:            46px;
line-height:      46px;
border:            1px solid #890000;
color:              #000000;
font-weight:    bold;
background-color: #e5e5e5;
background-image: url(http://www.абсолютный_путь_к_папке_images/loadingcircle.gif);
background-position: 6px center;
background-repeat: no-repeat;">

<script type="text/javascript">
if (typeof window_width == 'undefined' || typeof window_height == 'undefined') {
var window_width;
var window_height;
if( typeof( window.innerWidth ) == 'number' ) {
  window_width = window.innerWidth;
  window_height = window.innerHeight;
} else if( document.documentElement &&
    ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
  window_width = document.documentElement.clientWidth;
  window_height = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
  window_width = document.body.clientWidth;
  window_height = document.body.clientHeight;
}
}
var left = Math.round((window_width - 200) / 2);
var top = Math.round(((window_height - 46) / 3) + 46);
document.getElementById('pageIsLoading').style.left = left+'px';
document.getElementById('pageIsLoading').style.top = top+'px';
</script>
Загружается... Ждите...
</div>
Разумеется, настройки стиля отображения и текста можно изменить на ваш вкус.
4. Непосредственно перед тегом </body> в самом конце файла добавляем код:
Код
<script type="text/javascript">
if (window.addEventListener) {
window.addEventListener('load', hideLoading, false);
} else if (window.attachEvent) {
var r = window.attachEvent("onload", hideLoading);
} else {
hideLoading();
}
</script>
5. Закидываем прилагаемую картинку в папку images вашего сайта.
6. Тащимся от собственной крутизны... :)

Разумеется, вы можете использовать любую другую картинку - пропишите ее имя в коде и бросьте ее на сайт в указанное место.

[вложение удалено Администратором]
« Последнее редактирование: 02.04.2006, 13:09:35 от Adeptus »
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
Re: Создаем индикатор загрузки сайта
« Ответ #1 : 02.04.2006, 02:21:30 »
ну вот, теперь у себя придётся переделывать.... ;D
Как правильно задавать вопрос службе технической поддержки  yes!
SGA CM 7.2.0 RC0 KANG Build GWK74 + s95allinonescript + CWM 5.0.2.6 + Modem XWKT3
*

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Re: Создаем индикатор загрузки сайта
« Ответ #2 : 02.04.2006, 02:32:01 »
ну вот, теперь у себя придётся переделывать...
Дык у тебя практически все так и есть. Только надпись не по-русски... :)
*

inORANGEstylee

  • Захожу иногда
  • 55
  • 27 / 5
  • Joomla Fan
Re: Создаем индикатор загрузки сайта
« Ответ #3 : 02.04.2006, 03:32:18 »
2 Adeptus, прикольненько. спасиб ну и +1 держи :)

Re: Создаем индикатор загрузки сайта
« Ответ #4 : 02.04.2006, 09:52:30 »
Извините что влезаю, а зачем это нужно?
*

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Re: Создаем индикатор загрузки сайта
« Ответ #6 : 02.04.2006, 12:13:08 »
2 Adeptus, прикольненько. спасиб ну и +1 держи :)
Не за что! Ну и тебе спасибо за оценку... :)
*

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Re: Создаем индикатор загрузки сайта
« Ответ #7 : 02.04.2006, 12:16:40 »
Извините что влезаю, а зачем это нужно?
Ну... Дык... Эта... Елы-палы... Того...
А зачем вообще нужны всякого рода красивости/технологические продвинутости?
Когда вы, коллега, XP стартуете - зачем по бутскрину индикатор бежит?
А Виста вообще будет при загрузке Авророй переливаться...

РЕЗЮМЕ: шоб было! :)
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
Re: Создаем индикатор загрузки сайта
« Ответ #8 : 02.04.2006, 12:30:23 »
Извините что влезаю, а зачем это нужно?
а это некая такая попытка хоть как-то (частично) решить вопрос об ожидании загрузки сайта

2 Adeptus
было бы корректным всё же написать, что данное решение было ...ээээ... "подсмотрено" у d4.
и что loadingcircle.gif - это тоже их.
Как правильно задавать вопрос службе технической поддержки  yes!
SGA CM 7.2.0 RC0 KANG Build GWK74 + s95allinonescript + CWM 5.0.2.6 + Modem XWKT3
*

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Re: Создаем индикатор загрузки сайта
« Ответ #9 : 02.04.2006, 13:08:28 »
было бы корректным всё же написать, что данное решение было ...ээээ... "подсмотрено" у d4.
и что loadingcircle.gif - это тоже их.
Да я и не претендовал на авторство, вроде бы...
Только про д4 я не знал - скрипты выдрал по просьбе одного из пользователей из какого-то шаблона, предоставленного им же (указания на авторство не было), для того, чтобы можно было использовать в любом шаблоне... :)

ЗЫ: тем не менее, первый пост поправил на предмет первоисточника...
« Последнее редактирование: 02.04.2006, 13:10:12 от Adeptus »
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
Re: Создаем индикатор загрузки сайта
« Ответ #10 : 02.04.2006, 13:12:07 »
ок
Как правильно задавать вопрос службе технической поддержки  yes!
SGA CM 7.2.0 RC0 KANG Build GWK74 + s95allinonescript + CWM 5.0.2.6 + Modem XWKT3
*

Bogus

  • Захожу иногда
  • 94
  • 5 / 2
  • В глазах обида, в руках утюг!
Re: Создаем индикатор загрузки сайта
« Ответ #11 : 11.04.2006, 10:45:08 »
по прочтению плакал :)    +1 Адептусу

Re: Создаем индикатор загрузки сайта
« Ответ #12 : 09.06.2006, 17:18:31 »
у меня может что-то не получилось..но ..в общем смотрите: http://trinke.net
он всё время крутится..=(..

Re: Создаем индикатор загрузки сайта
« Ответ #13 : 09.06.2006, 20:43:20 »
у меня может что-то не получилось...

Естессно, "Script Error".

Строка:2145
Символ:9
Ошибка:"hideLoading" - определение отсутствует

Re: Создаем индикатор загрузки сайта
« Ответ #14 : 10.06.2006, 21:05:37 »
Прикольно...FireFox 2 альфа2 при загрузке заявляет о зависшем скрипте и выгружает его напроч...
*

annik

  • Осваиваюсь на форуме
  • 39
  • 2 / 1
Re: Создаем индикатор загрузки сайта
« Ответ #15 : 16.06.2006, 23:50:21 »
у меня может что-то не получилось..но ..в общем смотрите: http://trinke.net
он всё время крутится..=(..
хи-хи .
У меня 2 недели работал нормально, а теперь постоянно крутится, хотя я к коду даже не притрагивался.. Что такое?
http://www.*******.ru/
« Последнее редактирование: 25.05.2007, 00:22:29 от annik »
*

Александр Фёдоров

  • Захожу иногда
  • 143
  • 26 / 4
  • Жизнь - удивительная штука
Re: Создаем индикатор загрузки сайта
« Ответ #16 : 17.06.2006, 00:14:56 »
Уважаемые!

Совершенно жутко смотрится этот индикатор загрузки на сайтах!!
Посмотрел несколько сайтов по ссылкам с форума - бесит надпись "Загрузка... Ждите..." и т.п.

Подобная штука хороша только при выполнении какой-либо долгой операции на сервере (например, проверка whois или т.п.), т.е. когда пользователь знает, что ему надо подождать... А когда эта картинка вылетает на полсекунды, а затем гаснет... да еще на каждой странице... Больше трех страниц смотреть не хочется.

Чем меньше отвлекающих моментов на сайте, тем лучше (если вы его, конечно, не делаете только для того, чтобы показать какие нужные и ненужные фенечки бывают).
Жизненно важный ингредиент успеха — это не знать, что задуманное вами невозможно выполнить. М.Жванецкий

Re: Создаем индикатор загрузки сайта
« Ответ #17 : 17.06.2006, 00:34:10 »
Совершенно согласен с Александр Фёдоров
*

annik

  • Осваиваюсь на форуме
  • 39
  • 2 / 1
Re: Создаем индикатор загрузки сайта
« Ответ #18 : 17.06.2006, 10:50:54 »
Совершенно согласен с Александр Фёдоров
ну раз гуру сказали, значит удалим..
*

Ctrelok

  • Осваиваюсь на форуме
  • 26
  • 0 / 2
Re: Создаем индикатор загрузки сайта
« Ответ #19 : 09.08.2006, 23:34:20 »
Не подскажите, а как скрпит использовать, чтобы он срабатывал, если страница загружается, скажем, более 3-х секунд. идея - хорошая, но вот действительно некрасиво выглядит, когда на каждой странице подряд выскакивает...
*

Timon_Crazy

  • Захожу иногда
  • 364
  • 31 / 4
  • Лицензнаци
Re: Создаем индикатор загрузки сайта
« Ответ #20 : 09.07.2007, 13:03:44 »
просто ставить таймер шоли.
простов время начала загрузки и текущее
если есть разница - то выводить.

это если на пальцах.
ЧаВо - FAQ - Вопросы
--
Сщастливый безумец -- не говори спасибо: + поставь не ставь минус - поругай.
*

chilly_bang

  • Захожу иногда
  • 113
  • 1 / 1
Re: Создаем индикатор загрузки сайта
« Ответ #21 : 09.07.2007, 13:47:26 »
простов время начала загрузки и текущее
если есть разница - то выводить.
полезная вещь очень. особенно когда надо хостера носом ткнуть... чтоб время исполнения скриптов подкрутил.
было бы вообще дико прикольно, если б можно было определять (в лог писать), какой именно скрипт долго исполняется (грузится дольше чем ...секунд). или как?
*

Poster

  • Осваиваюсь на форуме
  • 31
  • 7 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #22 : 09.07.2007, 15:11:56 »
поддерживаю Dutch идею
заливать все в Интро, и за пределы экрана, чтобы прокешировалось.

Только загвоздочка небольшая. Как сделать, чтобы интро грузилась только Один раз! (чтобы потом не надоедало), не зависимо от того, как человек попал на главную?
Прописывать в Cookies идентификатор пользователя и потом проверять, заполнен ли он?
*

dremora

  • Захожу иногда
  • 461
  • 48 / 12
Re: Создаем индикатор загрузки сайта
« Ответ #23 : 09.07.2007, 15:33:07 »
полезная вещь очень. особенно когда надо хостера носом ткнуть... чтоб время исполнения скриптов подкрутил.
было бы вообще дико прикольно, если б можно было определять (в лог писать), какой именно скрипт долго исполняется (грузится дольше чем ...секунд). или как?

Нет для этого есть режим отладки... Покажет за сколько страница сгенерирована и SQL запросы...
Всё что не анархия, то фашизм...
*

baser

  • Захожу иногда
  • 69
  • 19 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #24 : 09.07.2007, 15:34:22 »
А никто незнает как сделать себе такой компонентик или модуль как тут http://ajaxload.info/ а то постоянно залазить на этот сайт, что бы сделать анимированную иконку долго, а локально было бы быстрее, а то задумка у автора очень класная, штук 10 разных анимированных загрузок сделал себе минут за 5
*

archer1981

  • Захожу иногда
  • 285
  • 13 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #25 : 27.12.2007, 12:15:32 »
Вот значит сделал себе прогрессбар, соорудил с ajaxload gif-иконку. Вместе с ней использую надпись "загрузка страницы..." Теперь проблема в следующем - текст сливается со страницей. Как сделать нужный по размеру непрозрачный задник прогрессбара?
http://walkspb.ru - Энциклопедия Санкт-Петербурга
*

mosgaz

  • Захожу иногда
  • 65
  • 12 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #26 : 24.12.2008, 14:31:15 »
Уважаемый, Adeptus, подскажите пожалуйста каким образом этот код применить для отдельного div'a.

<div class="loader">
     <div class="content_container">
     </div>
</div>

... вроде этого
ACER == мусор.
*

noni

  • Новичок
  • 5
  • 0 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #27 : 07.06.2010, 13:45:07 »
Вещь нужная, но не для всего сайта. Подскажите пожалуйста, можно ли использовать этот индикатор для отдельных страниц? Если да то как?
*

Adeptus

  • Завсегдатай
  • 1861
  • 219 / 15
Re: Создаем индикатор загрузки сайта
« Ответ #28 : 07.06.2010, 15:06:21 »
Вещь нужная, но не для всего сайта. Подскажите пожалуйста, можно ли использовать этот индикатор для отдельных страниц? Если да то как?

Создавайте в шаблоне условие по $option.
*

mosgaz

  • Захожу иногда
  • 65
  • 12 / 0
Re: Создаем индикатор загрузки сайта
« Ответ #29 : 07.06.2010, 15:32:08 »
if ($_REQUEST ['option']=='com_example')

или $option = mosGetParam($_REQUEST, 'option');
      if ...
« Последнее редактирование: 07.06.2010, 15:36:35 от mosgaz »
ACER == мусор.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Частично слетел шаблон сайта

Автор artist

Ответов: 15
Просмотров: 8065
Последний ответ 18.09.2020, 17:02:14
от Kir
Значок (иконка, favicon) в названии сайта

Автор FxPunter

Ответов: 33
Просмотров: 162715
Последний ответ 04.04.2019, 22:04:51
от 4albon
Как реализована подобная шапка сайта?

Автор NAaTa

Ответов: 8
Просмотров: 9628
Последний ответ 02.08.2018, 12:29:03
от lexxbry
Отображение Вашего сайта в 19+ браузерах

Автор poizon

Ответов: 24
Просмотров: 28598
Последний ответ 18.02.2013, 18:55:24
от poizon
Дивы или таблицы с позиции SEO и скорости загрузки сайта ?

Автор Арчик

Ответов: 7
Просмотров: 6332
Последний ответ 14.08.2008, 20:58:38
от Арчик