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

равным «left». • 1 Ц Предположим, например, что имеется неупорядоченный список (т. е. список с маркерами) названий рецептов и необходимо, чтобы при щелчке посетителем на

названии рецепта справа от него выводилось изображение «готового» блюда. Для

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





Обратите внимание, что каждый элемент в маркированном списке представ — ляет собой гиперссылку, атрибут target которой заставляет Web-браузер выво-

дить на экран в том же внутритекстовом фрейме, «FoodPictureFrame», страницу, загружаемую при щелчке на гиперссылке. Таким образом, при каждом щелчке на гиперссылке в списке рецептов браузер загружает Web-страницу с фотографией готового блюда и выводит страницу во фрейме справа от списка.

А теперь предположим, что необходимо, чтобы во внутритекстовом фрейме под списком рецептов выводились инструкции по приготовлению. (Поместив

инструкцию во фрейм, вы дадите посетителю возможность пролистывать длинные инструкции, оставляя на экране список рецептов и фотографию готового продукта.)

Инструкции во фрейме под списком рецептов должны содержать описание опера- ций, которые необходимо выполнить, чтобы приготовить блюдо, фотография кото —

рого СОДерЖИТСЯ В ДРУГОМ Внутритекстовом фрейме («FoodPictureFrame») Справа ОТ списка рецептов. Таким образом, при щедчке посетителем на ссылке в списке рецептов Web-браузер должен одновременно обновить содержимое двух фреймов: фрейма с фотографией блюда и фрейма с описанием рецепта.



ПРАКТИКУМ

Для одновременного изменения содержимого обоих фреймов необходимо доба — вить в каждый дескриптор короткий JavaScript-код. (Подробное описание

JavaScript можно найти в главе 8. Тем не менее, вам не потребуется изучать всю главу для написания короткого кода для этого совета.) При щелчке на гиперс —

сылке посетитель вызывает событие onclick гиперссылки. В дескрипторе гипер —

Глава 5. XHTML и новые тенденции 27 3





ссылки указывается, что при щелчке на ней Web-браузер д0л

выполнить

одно или несколько JavaScript-операторов. Таким образом, для

одновременного

изменения содержимого в двух внутритекстовых фреймах можнф следующим об —

разом изменить ранее приведенный код:



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

avaScript-onepa — нутритекстовый

фрейм «RecipeFrame» (описанный в дескрипторе в нижней

части страни —

цы). Например, при нажатии первой гиперссылки, «тушеное

о по-американ —

ски», генерируется событие onclick, определенное в дескриптфе

ЭТОЙ ГИ-

пересылки. Web-браузер выполняет JavaScript-оператор, связан

ый с событием

onclick, который приводит к загрузке во внутритекстовый фрейм

RecipeFrame»

страницы RoastRecipe. htm. После выполнения JavaScript-операт ора браузер заг —

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

(«FoodPictureFrame»).

(RoastPic. htm)

рибуте targe t

Таким образом, в приведенном примере загружаются две Web-страницы: пер —

вая указана в атрибуте гиперссылки, а вторая в JavaScript-onepaTре (вызываемом

по событию onclick дескриптора ). Несмотря на то что JavaS cript-сценарий в

приведенном выше коде загружает лишь одну страницу, допус

ается загружать

одновременно несколько страниц, поместив в строку после атрирут*

onClic k ДО —

полнительные операторы. При этом выполняемые браузером оп фаторы должны

разделяться точкой с запятой (;), как показано в следующем фрагм нте кода:



onClick=»window. InlineFrameName. location=f WebPageURL’

window. InlineFrameName. location= ‘ WebPageURL’ ;

window. InlineFrameName. location= ‘ WebPageURL’ ; »



В каЖДОМ ИЗ ЭТИХ трех Операторов InlineFrameName ДОЛЖНО



быть заменено

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

страницу, адрес которой должен быть указан вместо WebPageURL.

27 4 Глава 5. XHTML и новые тенденции



Изменение внешнего вида XHTML-страницы на основе типа целевой системы

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

google.com bobrdobr.ru del.icio.us technorati.com linkstore.ru news2.ru rumarkz.ru memori.ru moemesto.ru

Оставить комментарий

Вы должны авторизоваться для отправки комментария.

Полезные ссылки
Случайные записи
  • 27.02.2011">Руководство по actionscript. часть 6, стр. 034
  • 09.06.2011">Acer выпустит маленький ноутбук-трансформер
  • 19.11.2011">Обзор HTC Radar
  • 26.02.2011">Руководство по actionscript. часть 6, стр. 072
  • 26.02.2011">Руководство по actionscript. часть 6, стр. 070
  • 17.03.2011">Руководство по actionscript. часть 2, стр. 154
  • 09.05.2010">Самоучитель по креативному веб-дизайну. Книга 1, стр.139
  • 23.01.2011">Руководство по actionscript. часть 1, стр. 035
  • 19.02.2013">Избавление от шлаков и токсинов
  • 16.03.2011">Руководство по actionscript. часть 3, стр. 025
  • 06.09.2011">Skype – революционное решение для общения в сети
  • 13.03.2011">Руководство по actionscript. часть 3, стр. 097
  • 18.05.2010">Самоучитель по креативному веб-дизайну. Книга 2, стр.51
  • 12.06.2010">Самоучитель по креативному веб-дизайну. Книга 4, стр.112
  • 12.06.2010">Самоучитель по креативному веб-дизайну. Книга 4, стр.114
Опрос

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

View Results

Loading ... Loading ...