Самоучитель по креативному веб-дизайну. Книга 3, стр.58

свойстве document. cookie пары имен/значений из cookie-наборов, которые мо — гут быть использованы сценариями на Web-странице. Прежде чем вы сможете использовать значение cookie-набора, вам потребуется извлечь значение из стро —

ки всех имеющихся имен и значений cookie-набора в свойстве document. cookie.

Глава 8. JavaScript 43 1





ПРАКТИКУМ

Приведенная ниже JavaScript-функция возвращает значение отдельного cookie — набора из свойства cookie объекта документа:

function cookieValue (FirstChar)

{

// Пары «имя/значение» cookie-набора в свойстве document. cookie

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

// точки с запятой после начала значения cookie-набора,

var LastChar = document. cookie. indexOf («;», FirstChar);

if (LastChar == -1)

LastChar = document. cookie. length;

return unescape(document. cookie. substring(FirstChar, LastChar));

}



Функция unescape () в последнем операторе функции cookieValue () преоб — разовывает управляющие последовательности в значении cookie-набора в соот — ветствующие им ASCII-символы. Вспомните: в предыдущем практикуме при сохра —

нении значения cookie-набора вы пользовались функцией escape() . В результате

браузер сохранил «kki@NVBizNet. com» В COOkie-фаЙле каК «kki%40NVBizNet. com».

Функция unescape( ) преобразовывает управляющую последовательность «%40″

обратно в символ @.

Прежде чем вы сможете вызвать функцию cookieValue о, вы должны узнать,

где в строке всех пар имен/значений cookie-набора в document. cooki e начинает —

ся значение требуемого cookie-набора. Следующая функция найдет первый сим — вол в значении cookie-набора, имя которого вы передадите ей в параметре

CookieName. Вызвав функцию cookieValue (), функция getCookieValue () вер — нет значение cookie-набора, соответствующее имени, которое вы передали ей в параметре CookieName:

function getCookieValue (CookieName)

{

CookieName = CookieName + «=»;

var NameLength = CookieName. length;

var CookieLength = document. cookie. length;

var FirstChar = 0;

var LastChar = 0;

while (FirstChar

{

LastChar = FirstChar + NameLength;

if (document. cookie. substring(FirstChar, LastChar) == CookieName)

return cookieValue (LastChar);

// Перейти на 1 символ за пробел между парами «имя/значение» cookie-набора

FirstChar = document. cookie. indexOf (» «/FirstChar) + 1;

if (FirstChar == 0) break;

}

return null;

}

Следовательно, чтобы извлечь значения cookie-набора из свойства

document. cookie по имени, сначала объявите между начальным и конечным дескрипторами сценария ( ) в заголовке Web-страницы функ —

43 2 Глава 8. JavaScript





ЦИИ copkieValu e () И getCookieValu e () . Посл е ЭТОГО ВЫ СМОЖете ВСТавИТЬ СЦе —

нарий, аналогичный приведенному ниже, в тело Web-страницы, чтобы извлечь и отобразить имя, фамилию и адрес e-mail из cookie-набора, которые были сохра — нены в предыдущем практикуме (см. рис. 8.8).



Удаление cookie-набора из cookie-файла

Когда браузер просматривает cookie-файл в поисках cookie-наборов для добав — ления в свойство cooki e объекта документа текущей Web-страницы, он удаляет все cookie-наборы, срок действия которых истек. Помните: когда вы сохраняете cookie-набор, вы сохраняете дату истечения срока действия вместе с именем и значением cookie-набора. Поскольку каждый cookie-набор увеличивает размер cookie-файла и cookie-файл может содержать максимум 200 cookie-наборов на каж — дый домен, следует удалять cookie-наборы, которые больше вам не нужны. Посколь —

ку Web-браузер автоматически удаляет из cookie-файла cookie-наборы с истекшим сроком действия, просто установите дату истечения срока действия cookie-набора, который вы хотите удалить, равной дате и времени когда-нибудь в прошлом.



ПРАКТИКУМ

Объявив приведенную ниже функцию между начальным и конечным дескрипто- рами сценария ( ) в HTML-коде своей Web-страницы (пред — почтительно в заголовочном разделе), вы сможете вызывать функцию

deietecookie() всякий раз, когда вам понадобится удалить cookie-набор:

Глава 8. JavaScript 4 3 3





function DeleteCookie (CookieName)

{

document. cookie = CookieName + «=; expires=Thu, 01 Jan 1970 00:00:01 GMT»;

return;

}

Функция deieteCookie() «заканчивает» срок действия cookie-набора путем установки даты истечения срока действия cookie-набора равной самой ранней

применимой дате (одной секунде пополуночи 1 января 1970 года). Поскольку

сейчас правильное местное время на любом компьютере давно «перевалило» за 1

января 1970 года, вызов deietecookie() приведет к тому, что браузер удалит из cookie-файла тот cookie-набор, имя которого вы передадите функции в параметре CookieName. Предположим, например, вы ранее сохранили cookie-набор с име —

Самоучитель по креативному веб-дизайну. Книга 3, стр.59

нем toDelete. ЕСЛИ ВЫ ВЫПОЛНИТе Оператор deleteCookie(«toDelete») ; (как показано близ окончания следующего примера кода), Web-браузер удалит cookie- набор, как показано на рис. 8.9.



43 4 . Глава 8. JavaScript









document. write( !

cooki e = ‘ + document. cookie+’

‘) ;

deleteCookie(«toDelete») ;

document. write(!

cookie-Ha6opbi, имеющиеся ПОСЛЕ вызова функции ‘

‘deleteCookie()

‘) ;

document. write(»

cookie-набор = » + document. cookie+’

‘) ;











Экономия времени и усилий с помощью готовых (внешних) сценариев

Пополняя новыми «произведениями» свою библиотеку JavaScript, вы, несом — ненно, напишете ряд функций и сценариев, которые сможете использовать на нескольких Web-страницах. Хорошим примером этого могут послужить функции

отображения и обслуживания cookie-наборов, которые вы видели в предыдущих трех практикумах. Чтобы задавать, извлекать и удалять cookie-наборы, вы можете просто копировать и вставлять эти функции между начальным и конечным деск- рипторами сценария () каждой Web-страницы, где они вам понадобятся. Однако использование атрибута sr c в дескрипторе для подключения внешнего файла сценария может сэкономить вам время, которое в

ином случае пришлось бы потратить на поиски и копирование кода JavaScript в ваши Web-страницы. Более того, давая браузеру указание считывать код, сохра —

ненный в других файлах, вы уменьшаете «загроможденность» своего HTML-доку — мента, что позволит вам сконцентрировать свое внимание на тех дескрипторах, которые потребуется изменять, дабы содержимое вашего сайта не отставало от велений времени.

Самоучитель по креативному веб-дизайну. Книга 3, стр.60



ПРАКТИКУМ

Чтобы дать Web-браузеру указание подключить функции и сценарии, сохранен — ные во внешних файлах, добавьте в начальный дескриптор атрибут src

В ВИДе файла_сценария»>. ПредпОЛО — жим, например, вы храните файлы сценариев в папке с именем scripts, a Web — страницы — в папке hotdocs — обе находятся в корне вашего Web-сайта. HTML — код для включения функций (или сценариев), сохраненных в папке scripts, в Web-страницу, сохраненную в папке hotdocs, будет выглядеть примерно так:











Строка » . ./scripts » в примере кода — это относительный путь к файлу сце- нария, который должен подключить браузер. В данном случае, HTML сообщает браузеру, что тот может найти файл сценария относительно текущей Web-страни — цы (сохраненной в папке hotdocs), поднявшись на один уровень вверх в иерар —

хии папок (в корневую папку Web-сайта) и затем спустившись на один уровень

Глава 8. JavaScript 43 5





вниз в папку scripts. Если бы вам потребовалось включить этот же файл сцена —

рия в страницу (например, index. htm), .сохраненную в корне Web-сайта, деск — риптор выглядел бы следующим образом:





script src=»scripts/GetCookieValue. jsX/script>





В данном случае путь относительно текущей Web-страницы дает Web-браузеру указание начать с текущей цапки (корня Web-сайта) и перейти на один уровень

вниз в папку scripts. Вы можете включить в HTML-код столько пар дескрипто — ров сценария () , сколько необходимо для подключения фай — лов со сценариями и функциями, которые нужны на Web-странице. Например,

если вы сохранили функции управления cookie-наборами, о которых узнали в трех предыдущих практикумах, в трех файлах, для подключения этих файлов вам понадобится HTML-код, подобный следующему:













Обратите внимание, что сценарии, сохраненные во внешних файлах, не име — ют начальных и конечных дескрипторов сценария () .



Создание анимации с помощью события onLoad

Анимация на Web-странице создается путем отображения в быстром темце изображений одно за другим. Каждая картинка в анимации, как каждый кадр в фильме, слегка отличается от той, которая следует непосредственно перед ней. Ваш мозг воспринимает движение (то есть анимацию), когда объекты в одном

Самоучитель по креативному веб-дизайну. Книга 3, стр.61

месте на картинке «перемещаются» в другое место при замене Web-браузером те- кущего изображения следующим.



ПРАКТИКУМ

Добавив в дескриптор событие onLoad, вы можете дать Web-браузеру ука — зание заменять изображение, вставленное дескриптором в код страницы, другой картинкой всякий раз, когда браузер завершает загрузку изображения. Чтобы представить себе, как происходит этот процесс, следует понимать, что Web-брау —

зер активирует обработчик события onLoad после того, как загрузит (то есть ото- бразит) изображение на Web-странице. Следовательно, приведенный ниже деск —

риптор отобразит картинку из файла Framei. jpg. Затем браузер инициирует обработчик события onLoad, который, в свою очередь, вызовет (оп —

ределенную Пользователем) ФУНКЦИЮ nextlmage():



onLoad=»nextImage(document. animation, src)»>



Функция nextimage() создает анимационный эффект. Как вы увидите из

приведенного ниже кода, всякий раз, когда Web-браузер вызывает nextimage(),

43 6 Глава 8. JavaScript





функция изменяет свойство sr c изображения с именем animation в массиве изображений объекта документа. В результате изменения свойства sr c Web-брау — зер загружает (то есть отображает) другое изображение, что, в свою очередь, ини — циирует событие onLoad, и процесс повторяется:







function nextlmage(ImageSource)

{

var i = ImageSource. indexOf (M. jpg»,0);

var NextFrame = ImageSource. substring(i-1, i) ;

if (NextFrame == «1″) I И

document. animation. src = «Frame2.jpg»;

else if (NextFrame == «2″)

document. animation. src = «Frame3.jpg»;

else if (NextFrame == «3″)

document. animation. src = «Frame4.jpg»;

else

document. animation. src = «Framel. jpg»;

return;

}

// —>



Анимация, отображаемая приведенным выше кодом, состоит из четырех кад- ров (то есть четырех разных картинок) и повторяется бесконечно. Чтобы остано —

вить анимационную последовательность после того, как она будет воспроизведе —

на один раз, удалите два оператора перед оператором return ; функции. Если вы не загрузите первое изображение снова после загрузки последнего, браузер вызовет

nextimageо еще раз после загрузки Frame4.jpg. Однако во время последнего про —

хода nextlmage () не изменяет СВОЙСТВО src изображения С Именем animation, ПО — скольку ни один из операторов if функции не оказывается истинным. В результате анимация останавливается, поскольку Web-браузер больше не инициирует событие onLoad, так как функция не дала браузеру указания загрузить другую картинку.

Самоучитель по креативному веб-дизайну. Книга 3, стр.62



Отображение самоизменяющихся баннеров

с помощью JavaScript

Баннеры присутствуют практически на каждом Web-сайте коммерческой на — правленности. Замысел прост: отображение небольшого графического изображе — ния, рекламирующего компанию или продукт. Вместо того чтобы заполнять весь экран рекламой (и навсегда отпугнуть посетителей от вашего сайта), вы можете отображать (неограниченную) последовательность рекламных изображений внут — ри небольшой области на экране, заменяя одну картинку другой через заданные

интервалы времени. Собственно говоря, отображение баннеров во многом похо —

дит на создание анимации (о которой вы читали в предыдущем практикуме). И

анимация, и самозаменяющиеся баннеры требуют от ЛУеЬ-браузера отображения серии картинок одной за другой. В случае баннера, однако, вам нужно, чтобы браузер оставлял каждую картинку на экране в течение 5—10 секунд, чтобы у по — сетителя было достаточно времени на просмотр рекламы.

Глава 8. JavaScript 43 7





ПРАКТИКУМ

Чтобы создать самозаменяющийся (вращающийся) баннер, включите обработчик события onLoad, аналогичный приведенному ниже, в дескриптор HTML — кода Web-страницы:







В данном случае обработчик события onLoad дает Web-браузеру указание выз —

вать определенную пользователем функцию rotateBanner () после того, как бра — узер загрузит (отобразит) Web-страницу в окне приложения. Хотя JavaScript-фун — кция может заменить изображение, отображаемое на Web-странице, функция не может добавить на страницу новое изображение. Поэтому вы должны отобразить исходный баннер, вставив дескриптор , аналогичный показанному при — мерно в середине следующего HTML-кода, куда-нибудь в тело Web-страницы:

Самоучитель по креативному веб-дизайну. Книга 3, стр.63



HTML & Web Design Tips & Techniques



name=»banner» src= «images/Banner 1. jpg»X/td>







Наконец, объявите между начальным и конечным дескрипторами сценария () в заголовочной части HTML-кода Web-страницы функцию rotateBanner (), аналогичную показанной ниже:



function rotateBanner(BannerSrc)

{

var TimerlD

// Заменить изображение

document. banner. src = BannerSrc;

// Ожидать тайм-аута и вызвать саму себя для замены

//на следующее изображение

if (BannerSrc == «Bannerl. jpg»)

TimerlD = setTimeout(«rotateBanner(‘Banner2.jpg’)»,5000);

else if (BannerSrc == «Banner2.jpg»)

TimerlD = setTimeout(«rotateBanner(‘ВаппегЗ. jpg’)»,5000);

else if (BannerSrc == «Banner3.jpg»)

TimerlD = setTimeout(«rotateBanner(‘Banner4.jpg’)»,5000);

else

TimerlD = setTimeout(«rotateBanner(‘Banner1.jpg’)»,5000);

return;

}



Каждый раз, КОГДа фуНКЦИЯ rotateBanner () Изменяет СВОЙСТВО src ИЗОб —

ражения с именем animation в массиве изображений объекта документа,

Web-браузер выводит на экран новое изображение. Встроенная функция

setTimeout () создает эффект «изменяющегося» баннера, каждые пять секунд

рекурСИВНО ВЫЗЫВаЯ фуНКЦИЮ rotateBanner (), ЧТОбы ПОМенЯТЬ баннер На

Web-странице. Синтаксис вызова функции setTimeout о может сперва пока —

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

43 8 Глава 8. JavaScript





через число миллисекунд, указанное во втором параметре. Таким образом, при син —

таксисе TimerlD = SetTimeout («выражение» , задержка в миллисекундах), первый

вызов setTimeouto в данном сценарии дает Web-браузеру указание вызвать фун —

кцию rotateBanner () через 5 000 миллисекунд (то есть через 5 секунд) и пере —

дать имя пути «следующего» отображаемого баннера (images/Banner2. jpg). Что —

бы отображать свои собственные баннеры, просто замените путевые имена в

этом примере на имена путей своих баннеров и установите задержку в миллисе —

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

количество баннеров можно, вставив или удалив операторы els e if.

Примите к сведению, что почти все (а, скорее, все) баннеры позволяют посе- тителям щелкать на них, чтобы проследовать по гиперссылке на Web-страницу, где можно приобрести рекламируемый продукт или заказать услугу. В следующем практикуме вы научитесь заменять не только графическое изображение, но и ги — перссылку, связанную с баннером.



Направление гиперссылок на новые файлы «на лету11

Когда посетитель производит щелчок на тексте гиперссылки или на «горячей области» навигационной карты, Web-браузер извлекает Web-страницу (или иной

файл), заданную атрибутом href в дескрипторе гиперссылки. Обычно вам нужно, чтобы Web-браузер извлекал один и тот же файл каждый раз, когда посе — титель щелкает на данной гиперссылке. Однако иногда удобным окажется на — правлять гиперссылку на новый файл в зависимости от даты или графического изображения, находящегося на экране, когда посетитель выполняет щелчок мышью.

К счастью, массив links в объекте документа имеет три свойства, которые можно

изменять, дабы направить гиперссылку на новый файл: hash, pathname и href.



ПРАКТИКУМ

Свойство hash позволяет изменить все, что находится в гиперссылке справа от знака решетки (#). По сути, свойство hash дает возможность изменить имя целе-’ вой закладки, не меняя при этом файл, который должен извлечь браузер. Пред — положим, например, у вас есть следующая гиперссылка, которая указывает на

Самоучитель по креативному веб-дизайну. Книга 3, стр.64

Закладку monday на Web-СТранице events. htm:



События сегодняшнего дня

Полагая, что это первая гиперссылка на странице, можно определить опера —

тор document, link s [0] .hash = «tuesday»;, КОТОРЫЙ Обеспечит изменение цели

ГИПерССЫЛКИ На «htt p : //www. NVBizNet. com/htdocs/events. htm#tuesday». Сле —

довательно, если в events. htm есть закладка для каждого дня недели, вы можете

с помощью одной-единственной гиперссылки добираться до раздела текущего

дня всякий раз, когда посетитель щелкает на тексте гиперссылки — «События сегодняшнего дня». Вам потребуется всего лишь написать сценарий, который с

помощью метода getDayO объекта даты будет определять день недели и затем

Глава 8. JavaScript 43 9





присваивать текущий день недели свойству hash всякий раз, когда браузер загру — жает Web-страницу.

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

меняя при этом доменное имя или закладку (если таковая имеется). Предполо —

жим, например, у вас есть следующая гиперссылка, указывающая на файл с име — нем Jan. htm В папке /news/2001:



Дни рождения в этом месяце

Полагая, что это вторая гиперссылка на странице, оператор

document. link s [1 ] .pathname = M /news/2001/Feb. htm» ; изменит цель ГИПерССЫЛ —

КИ на «htt p : //www. NVBizNet. com/news/2001/Feb. htm#birthday» . (Обратите

внимание, что ссылка на закладку «birthday» при присвоении не потерялась.) Следовательно, сохраняя ежемесячные бюллетени новостей компании в папке

/news/2001 на Web-сайте, вы сможете использовать одну гиперссылку, чтобы пе —

реносить раздел «birthday» бюллетеня текущего месяца всякий раз, когда посе — титель щелкает на тексте гиперссылки — «Дни рождения в этом месяце». Вам потребуется только написать сценарий, который с помощью методов объекта даты getYear() и getMonth() будет составлять имя пути на основании года и

месяца, а затем присваивать новые путь и имя файла свойству pathname всякий раз, когда браузер загружает Web-страницу.

Свойство href позволяет изменить весь URL-адрес гиперссылки. По сути, за- дание свойства href в массиве link s оказывает тот же эффект, что и задание но- вого значения атрибута href в дескрипторе гиперссылки. Предположим, на — пример, у вас есть изменяющийся баннер, и вы хотите, чтобы посетители могли переходить на Web-сайт той или иной компании, щелкая на соответствующем баннере. Сначала свяжите гиперссылку с баннером с помощью HTML-кода, ана — логичного показанному ниже:

Самоучитель по креативному веб-дизайну. Книга 3, стр.65



img border=»0″ name=»banner» src=» images/Banner 1. jpg»X/a>



Затем обновите функцию, которая подменяет баннеры, добавив операторы, присваивающие Web-адрес компании свойству href (такие как в первой группе

операторов if. . .els e в приведенной ниже функции):



function rotateBanner(BannerSrc)

{

var TimerlD

// Заменить изображение

document. banner. srс = BannerSrc;

// Обновить гиперссылку баннера на адрес Web-сайта

// сбответствующей компании

if (BannerSrc == «Bannerl. jpg»)

document. links[0].href = «http://NVBizNet. com»

else if (BannerSrc == «Banner2.jpg»)

document. links[0].href = «http://NVBizNet2.com»



440 Глава 8. JavaScript





else if (BannerSrc == «Banner3.jpg»)

document. links[0]-href = «http://osborne. com»

else

document. links[0].href = «http://mcgrawhill. com»



// Ожидать тайм-аута и вызвать саму себя для замены

//на следующее изображение

if (BannerSrc == «Bannerl. jpg»)

TimerlD = setTimeout(«rotateBanner(‘Banner2.jpg’)»,5000);

else if (BannerSrc == «Banner2.jpg»)

TimerlD = setTimeout(«rotateBanner(‘ВаппегЗ. jpg’)»,5000);

else if (BannerSrc == «Banner3.jpg»)

TimerlD = setTimeout(«rotateBanner(‘Banner4.jpg’)»,5000);

else

TimerlD = setTimeout(«rotateBanner(‘Bannerl. jpg’)»,5000);

return;

}



Предварительное кэширование файлов для уменьшения времени отображения изображений

Предварительное кэширование графических изображений — это прием, с по — мощью которого вы даете Web-браузеру указание извлечь картинки с Web-сервера

в настоящий момент, в предвидении того, что позже вам может понадобиться отобразить эти изображения. Поручив браузеру извлечь картинки в фоновом ре- жиме (то есть пока посетитель делает на странице что-либо иное), вы можете ус- транить проблему задержки загрузки, с которой столкнется пользователь, щелк —

нув на миниатюре, чтобы увидеть большое изображение. Аналогично, если в вашей Web-странице использовано много сценариев, отображающих графические

изображения для эффектов смены изображения при наведений курсора или ани —

мации, вам стоит предварительно загружать в кэш еще не отображенные изобра- жения. Предварительно загруженное в кэш изображение, будучи востребовано браузером, появится на экране мгновенно — без задержки (возможно, достаточно продолжительной), связанной с ожиданием отправки изображения браузеру Web — сервером. Предположим, например, на вашей Web-странице присутствует восемь

миниатюр, как показано на рис. 8.10.



ПРАКТИКУМ

Предварительно загрузить в кэш изображения, которые браузер будет отображать

по щелчку посетителя на миниатюре, можно, вставив обработчик события

onLoad либо в дескриптор Web-страницы, либо в один из дескрипторов

миниатюр. Например, если вы вставите в дескриптор последней

миниатюры на рис. 8.10 следующий обработчик события onLoad, Web-браузер вызовет определенную пользователем функцию preCache():




src=»images/Pix8_small. jpg»X/aX/td>

Глава 8. JavaScript 441





Создав новый массив с именем Pictures, функция с помощью конструктора new image о создает новые объекты изображений, в которые затем загружает изображения с Web-сервера. Web-браузер не отображает изображения в то время,

когда функция загружает их с Web-сайта. Тем не менее, браузер сохраняет файлы

изображений в кэше системы. Когда посетитель щелкает на миниатюре, чтобы

получить изображение большего размера, извлеченное функцией preCache(), браузер может извлечь большую картинку из локального кэша (то есть из памяти или с жесткого диска локального компьютера). Таким образом, загрузка больше —

Самоучитель по креативному веб-дизайну. Книга 3, стр.66

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

да браузеру приходится извлекать изображение с Web-сервера. В результате соот —

44 2 » Глава 8. JavaScript





ветствующее большее изображение появляется на экране незамедлительно после щелчка посетителя на миниатюре. Если вы решите использовать предваритель — ное кэширование изображений, убедитесь, что Web-браузер загружает картинки,

вставленные в Web-страницу, до вызова функции preCache(). В конце концов, ваша цель — загрузить изображения в кэш системы, чтобы браузер смог быстрее отобразить изображения, если посетитель попросит их показать. Заставить посе — тителя дожидаться возможности увидеть другие изображения, пока вы загружаете

массу картинок в кэш системы — это последнее, чего вы хотите добиться, особенно если в конечном итоге посетитель не станет просматривать эти картинки вовсе.

Выбирая, куда поместить обработчик события onLoad, который будет вызы- вать функцию precache(), следует понимать, как браузер извлекает и отобража —

ет содержимое Web-страницы. Браузер сначала выводит текст и отображает фор — мы и таблицы, обнаруженные им в HTML-коде. Затем браузер открывает несколько одновременных соединений с Web-сервером для загрузки графических изображений, помещенных на страницу. Поместив обработчик события onLoad в

Самоучитель по креативному веб-дизайну. Книга 3, стр.67

последний дескриптор HTML-кода Web-страницы, вы сможете быть уве — ренным в том, что браузер по крайней мере начал загружать все миниатюры, прежде чем вызывать функцию предварительного кэширования. Более того, если миниатюры не все имеют одинаковые размеры, и есть возможность по-разному расположить их на странице, присвойте имя пути файла миниатюры с самым большим размером файла атрибуту src последнего дескриптора . Таким

образом, к тому моменту, когда браузер завершит загрузку последней, самой

большой миниатюры, и обработчик события onLoad обратится к функции

preCache(), все миниатюры будут загружены.



Создание бегущей строки с помощью JavaScript

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

Explorer. В результате этого при использовании для отображения бегущей строки на

Web-странице дескриптора посетители, пользующиеся Netscape Navigator, видят строку с обыкновенным неподвижным текстом. К счастью, в JavaScript есть функции для работы с таймером и строками, с помощью которых можно превра —

тить однострочное текстовое поле в область для отображения бегущей строки.



ПРАКТИКУМ

Для создания бегущей строки нужно сперва определить форму с двумя текстовы — ми полями — скрытым полем, в котором будет содержаться текст бегущей стро — ки, и видимым полем, в котором будет отображаться движущийся текст. Напри- мер, приведенный ниже HTML-код создает форму, позволяющую отображать бегущую строку, в которой в любой момент времени будут видны до 50 символов:



Полезные ссылки
Случайные записи
  • 25.02.2011">Руководство по actionscript. часть 6, стр. 090
  • 06.08.2011">Сайты знакомств помогают соединять сердца
  • 16.03.2011">Руководство по actionscript. часть 3, стр. 027
  • 20.03.2011">Руководство по actionscript. часть 2, стр. 078
  • 09.05.2010">Самоучитель по креативному веб-дизайну. Книга 1, стр.163
  • 22.01.2011">Руководство по actionscript. часть 1, стр. 103
  • 18.03.2011">Руководство по actionscript. часть 2, стр. 129
  • 21.03.2011">Руководство по actionscript. часть 2, стр. 029
  • 07.03.2011">Руководство по actionscript. часть 4, стр. 104
  • 26.07.2010">Функциональная навигация
  • 08.03.2011">Руководство по actionscript. часть 4, стр. 079
  • 20.03.2011">Руководство по actionscript. часть 2, стр. 072
  • 23.01.2011">Руководство по actionscript. часть 1, стр. 094
  • 18.08.2012">Apple назвала условия урегулирования министерства юстиции несправедливыми
  • 10.05.2010">Самоучитель по креативному веб-дизайну. Книга 1, стр.51
Опрос

Какие цвета вы предпочитаете?

View Results

Loading ... Loading ...