Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Полоса загрузки, прострой пример 
:(
    Опции темы
Rivelt_Silverbeast
Дата 4.2.2007, 18:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 11
Регистрация: 4.2.2007

Репутация: нет
Всего: 1



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

Реализация этой идеи (по сути дела, заимствованной из программирования на ActionScript... а оттуда ещё откуда-то :D ):

В текст страницы вставляем HTML-код блока полосы загрузчика:
Код

<div id='loader' style="position:absolute;left:224px;top:320px;color:silver;">
<span style='border:1px silver solid;height:10px;width:100px;padding:0px;'><img id='loaderbar' src='pic/point.gif' style='width:0px;height:10px;'></span>
<br>
<div id='loaderstring'></div>

Позиционирование тега loader - в зависимости от конкретной страницы, можно и его и вовсе не задавать явно.
Картинка point.gif - это белая точка 1x1, растянутая до подходящих размеров. Её можно заменить на тег div, сo свойствами style="height:8px;width:0px;bachground-color:white;", но я решил всё же использовать первый вариант.

Затем, перед телом страницы (чтобы функция загрузилась до того, как начнёт загружаться тело страницы и объекты, её использующие - об этом позже) определяем такую функцию:
Код

ldpc=0;   // объём загруженной графики (в процентах)

function Load(pc)    //сама функция
{
ldpc+=pc;
loaderbar.style.width=ldpc;                            //удлиняем полосу...
loaderstring.innerHTML='Loading: '+ldpc+'%';    
}


После этого к наиболее весомым картинкам нужно пришить обработчик события onLoad, например, так:
Код

<img class='pict_rc' src='../pic/Tree2.gif' onload='Load(8)'>

При этом аргументом Load должно служить число - процент объёма картинки от общего объёма всей графики на странице.
Тут, наиболее вероятно, может возникнуть несовместимость. Я новичок в javascript и не знаю, поддерживает ли тег <img> в FF и Opera событие onLoad. Кроме того, неудобно для каждой страницы обсчитывать "процентный вес" каждого изображения. Возможно, эту проблему можно решить, используя PHP.


Имхо, этот скрипт не имеет большого значения, и более того, всего лишь увеличивает общий объём кода страницы. Я написал его лишь для отработки навыка. Может быть, кто-нибудь потестит и обнаружит ошибки. Может, кому-нибудь пригодится при оформлении страници.
PM MAIL WWW   Вверх
Sardar
Дата 5.2.2007, 03:30 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Можно перед закрывающим </body> пробежаться по всем document.images и повесить проценты автоматом (исключая баннеры). Тогда страницы можно генерить  скриптами не задумываясь сколько и какие там картинки.

А вообще рюшечки всё это, даже раздражать могут больше чем нести пользы smile
Особенно если на время загрузку страницу скрывать, то вообще труба  smile 


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0562 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.