Полоса навигации
Таблица 7.3. Данные полосы навигации.
| Страница | Element Name | When Clicked, Go To URL |
|---|---|---|
| Главная | Main | Main .htm |
| Проекты | Projects | Projects.htm |
| Увлечения | Passions | Passions.htm |
| Ссылки | Links | Links .htm |
| Об авторе | About | About .htm |
В раскрывающемся списке in должен быть выбран пункт Main (имя фрейма основного содержимого сайта). Для элемента Main (страница основного содержимого сайта, отображаемая по умолчанию) включите флажок Show "Down Image" Initially, т. к. он должен быть по умолчанию "нажатым". В раскрывающемся списке Insert выберите пункт Vertical, т. к. полоса навигации в нашем случае должна быть вертикальной. Остальные элементы управления не трогайте. После этого нажмите кнопку ОК.
Осталось немного подредактировать фрейм и его содержимое вручную. Установите значения параметров Margin Width и Margin Height для фрейма в ноль, чтобы не было этих отвратительных отступов слева и сверху. Потом выделите таблицу и установите параметр Width в 100%, чтобы она заняла всю ширину фрейма. Осталось выделить все ячейки таблицы и выставить параметр Horz в Center, a Vert – в Middle. Вы помните, что обозначают эти параметры?
Посмотрите на рис. 7.24. Как видите, Dreamweaver здорово постарался, сделав за нас всю сложную работу по созданию "живой" полосы навигации. Если вы просмотрите сгенерированный им HTML-код, то увидите, как много работы пришлось ему проделать: сформировать таблицу, разместить в ней все указанные вами графические изображения, превратить их в гиперссылки и – главное – создать сценарии, которые будут ими управлять. Согласитесь, вручную такое не сразу сделаешь.
Рис. 7.24. Готовая полоса навигации
Теперь сохраните все фреймы, выбрав пункт Save All Frames в меню File. И откройте страницу в окне Web-обозревателя. Попробуйте поместить курсор мыши над каким-нибудь элементом полосы навигации и посмотрите, что получится. Пощелкайте по нему.
Как видите, даже очень сложные вещи делаются в Dreamweaver исключительно просто. Например, полоса навигации с активными изображениями для начинающего Web-дизайнера – весьма сложная задача: нужно хорошо знать не только язык описания Web-страниц HTML, но и язык написания сценариев JavaScript. И если с HTML, как правило, проблем нет, то с JavaScript – есть…
Хорошо! Мы сделали полосу навигации и поместили ее во фрейме. Но сайт наш, как и все на свете, изменяется. Что если нам вдруг понадобится добавить новый элемент или изменить графические изображения? Для этого просто выделите полосу навигации (любой ее элемент) и выберите в меню Modify пункт Navigation Bar. На экране появится диалоговое окно Modify Navigation Ваг, аналогичное уже знакомому вам окну Insert Navigation Bar (см. рис. 7.23), в котором вы сможете изменить все, что нужно.