Всем привет! В этом материале рассмотрим, как сделать анимацию, которая будет показываться при загрузке DOM .

Анимация при загрузке страницы.

Всем привет! В этом материале рассмотрим, как сделать анимацию, которая будет показываться при загрузке DOM.

Для этого вам нужно перейти сюда, скачать с помощью Bower или кнопок на сайте библиотеку.

Создайте div на странице

<div id="fakeLoader"></div>

Подключите стили

<link rel="stylesheet" href="yourPath/fakeLoader.css">

Подключите скрипты

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
<script src="yourPath/fakeLoader.min.js">

Проведите базовую инициализацию

<script type="text/javascript">
$("#fakeloader").fakeLoader();
</script>

Установите опции, если нужно

<script type="text/javascript">
$("#fakeloader").fakeLoader({
timeToHide:1200, // Время в миллисекундах для исчезновения прелоадера
zIndex:"999",// Z-Index по умолчанию
spinner:"spinner1",// Опциии: 'счетчик 1', 'счетчик 2', 'счетчик 3', 'счетчик 4', 'счетчик 5', 'счетчик 6', 'счетчик 7'
bgColor:"#2ecc71", //Hex, RGB или RGBA цвета
imagePath:"yourPath/customizedImage.gif" // Если вы хотите, то можете установить свою картинку
});
</script>

Вот и все! Спасибо за внимание!