Данный скрипт будет полезен тем, чьи сайты медленно грузятся, т.к. индикатор загрузки позволит Вашим посетителям понять, что процесс загрузки сайта еще идет. Ниже мы хотим привести пример подобных индикаторов, которые Вы можете разместить в любом месте Вашего сайта:


После того, как сайт загрузился, через две секунды данные индикаторы автоматически плавно пропадают.

В данном примере мы специально установили таймаут в две секунды для того, чтобы индикаторы загрузки пропадали не сразу, а только через две секунды после окончания загрузки сайта. Обратите внимание, что индикаторы плавно растворяются, что тоже смотрится очень красиво.

Для того, чтобы получить на своем сайте подобные исчезающие индикаторы загрузки, Вам понадобится создать блок DIV внутри которого Вы разместите какой-либо текст или изображение.

                        
HTML код:

<div class="indicator" style="width:200px; border-radius:12px;

border:1px solid #4874a3; padding:5px;"><img src="indicator.gif" alt="">

</div>

Далее необходимо будет подключить стандартную библиотеку jQuery следующим образом:



JavaScript код:

<script type="text/javascript"

src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

После того, как библиотека подключена, нам необходимо отслеживать когда закончится загрузка сайта, для того чтобы убрать наши индикаторы загрузки. За это отвечает вот такой совсем компактный код:



JavaScript код:

<script type="text/javascript">

$(document).ready(function(){

 $("div.indicator").delay(2000).fadeOut(1000);

});

</script>