Прогресс-бар загрузки страницы как в Яндекс Браузере при помощи jQuery и CSS3

Разместил: Apocalypse
Опубликовано: 18 февраля 2018

Скачать Отличный современный прогресс-бар, который отображает степень загрузки вашего сайта в верхней части под адресным полем браузера Для начала посмотрите ДЕМО Установка: 1#: На нужных страницах вашего сайта между head и /head вставьте:

<link rel="stylesheet" type="text/css" href="/css/nprogress.css" />

1	<link rel="stylesheet" type="text/css" href="/css/nprogress.css" />

2#: На этих же страницах между body и /body вставьте:

<script src="/js/nprogress.js"></script>
<script>
NProgress.start();
$('body').show(); 
$(window).load(function() {			 
setTimeout(function() {
NProgress.done(); $('.fade').removeClass('out');
}, 1000);
});
</script>

NProgress.start();

$('body').show();

$(window).load(function() {

setTimeout(function() {

NProgress.done(); $('.fade').removeClass('out');

}, 1000);

});

</script>

Осталось лишь залить CSS файл из прикреплённого архива в папку css и JS файл в папку js Источник материала: http://zornet.ru

Метки: Browser CSS3 jQuery Preloader Progress Bar Yandex Браузер Загрузка Прелоадер Прогресс-Бар Яндекс

Apocalypse

Я не понял вашего вопроса, но постараюсь на него ответить...

Читайте также:

Вы точно не робот?

2 Комментарий

Старые

Новые

Межтекстовые Отзывы

Посмотреть все комментарии

Гость

Mih

3 лет назад

Работает! Спасибо!

Ответить

Автор

Apocalypse

3 лет назад

Ответить на Mih

Пожалуйста 😀

Ответить

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Внёс изменения в скрипт. Теперь сообщения добавляются от группы "Пользователи". Чтобы отправка заработала, изучи новый пункт 5 в описании к материалу. Прикреплённый архив также был перезалит» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 14:28:57

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Скрипт доработан. Архив перезалит. В описание внесён новый 5-й пункт, исправляющий проблему с отправкой у группы "Пользователи"» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 14:30:05

Всевидящее око

Новый комментарий от пользователя topka: «Ещё заметил что что там кнопка смайлики не реагирует, не открывается модаль окно.😀
Спасибо за исправления.» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 15:23:20

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Я щас немного поломал голову с PDA версией. Там хоть и есть оператор, отвечающий за модер панель, но он не работает. Хотел использовать родной скрипт удаления материалов от uCoz, так он работает через ID материала, а в PDA версии даже нет нужного оператора 😐» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 18:30:51

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Пожалуйста!» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 18:31:02

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Переписал часть скрипта и смог победить. Теперь работает как редактирование, так и удаление материалов как в обычной, так и в PDA версии» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 20:27:24

Всевидящее око

Новый комментарий от пользователя topka: «Работает) еще раз спасибо вам =)

А можно ли как-то сделать так чтобы каждый автор своего материала смог удалить свои комментарии или редактировать, а то только админ или модер может) это очень большой минус» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-12 21:52:40

Всевидящее око

Новый комментарий от пользователя Apocalypse: «К сожалению, такие права не позволяет выдать система uCoz... Для Гостевой книги нет возможности редактирования и удаления сообщений для обычных пользователей. На то она и Гостевая книга» в материале Онлайн чат через модуль «Гостевая книга» by uCodes для сайтов на uCoz [Исправления от IMAPO в 2023 году]

2023-03-13 11:00:12

Всевидящее око

Новый комментарий от пользователя костя: «не работает, как и всё остальное впринципе» в материале Призрачный эффект от курсора на HTML5 Canvas

2023-03-25 21:05:11

Всевидящее око

Новый комментарий от пользователя Apocalypse: «Что значит всё остальное? Этот материал проверен и работает. Смотрите ДЕМО» в материале Призрачный эффект от курсора на HTML5 Canvas

2023-03-25 21:12:52

......

Для публикации сообщений в чате необходимо авторизоваться

Прогресс-бар загрузки страницы как в Яндекс Браузере при помощи jQuery и CSS3

Читайте также:

Посетители сайта

Панель управления

Март 2023
Пн	Вт	Ср	Чт	Пт	Сб	Вс
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

Прогресс-бар загрузки страницы как в Яндекс Браузере при помощи jQuery и CSS3

Читайте также:

Клик по случайной кнопке на jQuery by Apocalypse

Разноцветные буквы в словах на jQuery by Apocalypse

Дождь, льющийся на зеркальный пол на HTML5 Canvas + CSS3

Посетители сайта

Панель управления