[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Индикатор загрузки страницы сайта
orlenokДата: Воскресенье, 03.05.2009, 13:57 | Сообщение # 1
Admin
Группа: Администраторы
Сообщений: 532
Статус: Offline



Панель управления --> Страницы сайта перед тегом </head> вставляем этот код:

Code
<script type="text/javascript">
function hideLoading()
{
document.getElementById('pageIsLoading').style.display = 'none';
}
</script>


и там же перед тегом </body> вставляем этот код:

Code
<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/имя_картинки.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>

<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>


Текст можно изменить на ваш вкус. Вместо "имя_картинки" можно ввести название файла с изображением, (файл заливаем в папку images вашего сайта) которое вы желаете показать на индикаторе. Сюда сможет подойти анимированая картинка .gif. Размер картинки при указанных в примере установках - примерно 32х32 пикселя.

Вот примеры картинки.gif



Посмотреть и скачать .gif картинки можно здесь.

Если вам захочется сделать так, чтобы пока идет загрузка все, что выводится на экране - это только индикатор, а вот когда она закончилась, только тогда вылезал сам сайт, то задайте высоту и ширину этому окошку, т.е. div`у него должен быть не 200 на 46, а 100% на 100%. Т.к. оно на первом фоне, посетитель будет видеть только его до конца загрузки.
 
  • Страница 1 из 1
  • 1
Поиск:

Скачать Adobe Photoshop

Как установить Adobe Photoshop

Adobe Photoshop Portable

Adobe Flash Professional

Orlenok Design Studio ® 2008 - 2024