• Страница 1 из 1
  • 1
Форум » Скрипты » JavaScript » Индикатор загрузки
Индикатор загрузки
HaZarDДата: Среда, 05.08.2009, 21:03 | Сообщение # 1
Главный Админ
Группа: Администраторы
Сообщений: 91
Награды: 0
Репутация: 1
Статус: Отключен
* Индикатор загрузки - маленькое окошко, которое видит пользователь, пока грузится сайт

1. Открываем шаблон
2. В любом месте между тегами <head> и </head> добавляем код:

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

3. Сразу после тега <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/loadingcircle.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.l eft = left+'px';  
document.getElementById('pageIsLoading').style.t op = top+'px';  
</script>  
Загружается... Ждите...  
</div>

Разумеется, настройки стиля отображения и текста можно изменить на ваш вкус.
4. Непосредственно перед тегом </body> в самом конце файла добавляем код:

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

5. Закидываем прилагаемую картинку в папку images вашего сайта.
6. Тащимся от собственной крутизны...


Если человек не хочет делать того, что надо, пусть он лучше не делает, того, что может...
 
Форум » Скрипты » JavaScript » Индикатор загрузки
  • Страница 1 из 1
  • 1
Поиск: