Модуль “Прелоадер” «Чертоги Фрилансера» v3.0.0

Модуль “Прелоадер” «Чертоги Фрилансера» v3.0.0

Модуль отображает процесс загрузки страницы в процентах и ​​с помощью прогрессера

Подключение модуля

[HTML] для всех HTML-страниц, где нужно использовать прелоадер, добавляем подключение файла html/_preloader.htm

@@include('html/_preloader.htm',{})
Сделать это нужно внизу файла перед подключением @@include(‘html/_js.htm’,{}), можно использовать снипет 
prl

[CSS] для редактирования стилей прелоадера нужно зайти в файл html/_preloader.htm и редактировать стили для классов прелоадера:

<style>
	/* Главный блок */
	.fls-preloader{
		pointer-events: none;
		z-index: -1;
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		display: flex;
		justify-content:center;
		align-items: center;
	}
	/* Блок с элементами */
	.fls-preloader__body{
		padding: 0.93rem;
		max-width: 31.25rem;
		display: flex;
		flex-direction: column;
	}
	/* Блок со счетчиком */
	.fls-preloader__counter{
		font-size: 10rem;
	}
	/* Прогресс бар */
	.fls-preloader__line{}
	/* Лінія прогресбару */
	.fls-preloader__line span{
		display: inline-block;
		height: 0.8rem;
		background-color: #7A956B;
	}
</style>
Оставить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Что будем искать? Например,Человек

Мы в социальных сетях