Учебник Macromedia Dreamweaver (стр. 98 из 135)
Таблица 13.3. События, поддерживаемые Dreamweaver
| Название | Описание |
| onAbortonBlur onChange onClick | Наступает, когда пользователь останавливает загрузку Web-страницы, например, нажав кнопку ОстановНаступает, когда элемент управления или сама страница теряет фокус вводаНаступает, когда посетитель изменяет значение элемента управленияНаступает при щелчке мышью по элементу страницы или по самой странице |
| onDblClick | Наступает при двойном щелчке мышью по элементу страницы или по самой странице |
| onError | Наступает при возникновении ошибки при загрузке страницы, графического изображения или внедренного элемента |
| onFocus | Наступает, когда элемент управления или сама страница получает фокус ввода |
| onHelp | Наступает, когда пользователь вызывает интерактивную справку Web-обозревателя |
| onKeyDown | Наступает при нажатии клавиши клавиатуры |
| onKeyPress | Наступает при нажатии и отпускании клавиши клавиатуры |
| onKeyUp | Наступает при отпускании клавиши клавиатуры |
| onLoad | Наступает по окончании загрузки страницы, графического изображения или внедренного элемента |
| onMouseDown | Наступает при нажатии кнопки мыши |
| onMouseMove | Периодически наступает при перемещении курсора мыши над элементом страницы или над самой страницей |
| onMouseOut | Наступает при "уводе" курсора мыши с элемента страницы |
| onMouseOver | Наступает, когда курсор мыши "заходит" на элемент страницы |
| onMouseUp | Наступает при отпускании кнопки мыши |
| onMove | Наступает при перемещении окна Web-обозревателя |
| onReset | Наступает, когда посетитель нажимает кнопку Сброс формы |
| onResize | Наступает при изменении размеров окна Web-обозревателя |
| onScroll | Наступает при прокрутке содержимого страницы или ее элемента посетителем |
| onSelect | Наступает при выделении текста в поле ввода |
| onSubmit | Наступает, когда посетитель нажимает кнопку Отправить формы, запуская отправку данных |
| onUnload | Наступает, когда посетитель покидает текущую Web-страницу |
На этом закончим наше затянувшееся вступление. Пора переходить к работе над поведениями в Dreamweaver.
Работа с поведениями
Здесь мы изучим приемы работы с поведениями в нашем любимом Dreamweaver. Изучать мы их будем на примере страницы default2.htm, созданной в качестве новой главной страницы первого сайта Sample site 1. Откройте ее в окне документа.
Панель Behaviors
Вся работа с поведениями будет протекать в специальной панели Behaviors. Чтобы вызвать ее на экран, включите пункт-выключатель Behaviors меню Window или нажмите комбинацию клавиш <Shift>+<F3>. Панель Behaviors показана на рис. 13.3.
Рис. 13.3. Панель Behaviors
Большую часть этой панели занимает список уже созданных к этому време,-ни поведений, привязанных к выделенному в окне документов элементу страницы. Наименование тега элемента, к которому привязаны отображаемые в списке поведения (по умолчанию это сама страница), находится выше этого списка. Если вы выделите в окне документа другой элемент, в списке панели тотчас отобразятся привязанные к нему поведения. К сожалению, узнать, к какому элементу страницы привязаны поведения, иным способом нельзя.
Список поведений представляет собой таблицу из двух колонок: Events (событие) и Actions (действие, происходящее в ответ на событие). Вы можете выбрать любое поведение в списке и произвести над ним какие-либо манипуляции.
Если вы поставите текстовый курсор на саму Web-страницу, выделив ее таким образом, то увидите, что в списке уже присутствует одно поведение -
Play Animation, привязанное к событию onLoad. Это поведение было добавлено самим Dreamweaver, когда мы включили флажок Autoplay в панели Timelines. Так что некоторые поведения создаются самим Dreamweaver без вашего ведома.
Вы, наверно, уже заметили, что в столбце Events списка, правее отображаемого в нем значения, находится небольшая кнопка со стрелкой, направленной вниз. При нажатии на эту кнопку на экране появляется меню событий, в котором вы можете выбрать событие, в ответ на которое будет происходить заданное вами действие. Это меню показано на рис. 13.4. Таким образом, вы можете изменить событие, в ответ на которое выполняется какое-либо действие, например, заставить анимацию проигрываться в ответ на щелчок мышью.
Рис. 13.4. Меню событий панели Behaviors
Чтобы отобразить в этом меню только события, поддерживаемые какой-либо программой Web-обозревателя, выберите пункт Show Events For. На экране появится небольшое подменю; включите пункт-выключатель, соответствующий нужной программе. Все пункты этого подменю перечислены в табл. 13.4.
Таблица 13.4. Пункты подменю Show Events For меню событий
| Пункт подменю | Отображаемые события |
| 3.0 and Later Browsers | Internet Explorer и Navigator, версии 3.0 и более поздние |
| 4.0 and Later Browsers | Internet Explorer и Navigator, версии 4.0 и более поздние |
| IE 3.0 | Interhet Explorer 3.0 |
| IE 4.0 | Internet Explorer 4.0 |
| IE 5.0 | Internet Explorer 5.0 |
| IE 5.5 | Internet Explorer 5.5 |
| IE 6.0 | Internet Explorer 6.0 |
| Netscape 3.0 | Navigator 3.0 |
| Netscape 4.0 | Navigator 4.0 |
| Netscape 6.0 | Navigator 6.0 |
Dreamweaver также предоставляет вам возможность изменить параметры выбранного в списке поведения. Для этого просто дважды щелкните по нему мышью, после чего на экране появится диалоговое окно задания параметров соответствующего поведения. Например, для поведения play Timeline такое окно выглядит так, как на рис. 13.5. В раскрывающемся списке Play Timeline выберите нужную анимацию и не забудьте нажать кнопку ОК для сохранения сделанных изменений или Cancel — для отказа от них.
Рис. 13.5. Диалоговое окно Play Timeline
Внимание!
Когда будете изменять событие или параметры поведения, не забудьте выделить в окне документа нужный элемент страницы.
В верхней части панели Behaviors находятся четыре кнопки: +, —, вверх и вниз. Давайте рассмотрим их по очереди.
Кнопка со знаком "плюс" позволит вам создать новое поведение. При ее нажатии на экране появляется довольно большое меню поведений (рис. 13.6), в котором можно выбрать нужное поведение. Некоторые из пунктов этого меню могут быть недоступными; это обычно означает, что в данный момент времени на странице нет необходимых элементов. Также некоторые поведения могут "прятаться" в подменю, например поведения, управляющие анимациями, находятся в подменю Timeline.
С помощью пунктов уже знакомого вам подменю Show Events For, находящегося в этом же меню, можно задать, поддерживаемые каким Web-обозревателем события будут отображаться в меню событий. Пункты этого подменю перечислены в табл. 13.4. Чтобы вывести нужный набор событий, просто выберите соответствующий пункт-выключатель.
Рис. 13.6. Меню поведений панели Behaviors
Итак, чтобы создать новое поведение, сначала выделите нужный элемент страницы. Вы также можете привязать поведение к самой странице, для чего щелкните по пустому месту на ней или выберите тег <BODY> в строке тегов. Затем выберите необходимый пункт в меню поведений. После этого на экране появится диалоговое окно задания параметров выбранного вами поведения. Такое окно для поведения Play Timeline показано на рис. 13.5. Задайте требуемые параметры и нажмите кнопку ОК. Диалоговые окна задания параметров для других поведений будут рассмотрены ниже.
Кнопка со знаком "минус" позволит вам удалить выбранное в списке поведение. С таким же успехом вы можете нажать клавишу <Del>. He забудьте только выделить в окне документа нужный элемент страницы.
Кнопки вверх и вниз перемещают выбранное в списке поведение на позицию вверх или вниз. Дело в том, что если несколько поведений привязано к одному и тому же событию, они выполняются в порядке следования в списке поведений. С помощью кнопок t и -I вы можете изменить этот порядок.
Создание поведений
Теперь настало время рассмотреть все поведения, предлагаемые нам Dreamweaver, их создание и все их параметры, которые вы можете задать.
Название поведения в терминологии самого Dreamweaver приведено в скобках, так что вы сразу сможете найти его в меню поведений.
Имейте только в виду, что здесь приводятся не все поведения, поддерживаемые Dreamweaver. Поведения, служащие для поддержки форм и элементов управления, рассмотрим в главе 16.
Вызов JavaScript-кода (CallJavaScript)
Если вы хотите, чтобы в ответ на какое-либо событие, произошедшее в том или ином элементе страницы, выполнялся некий JavaScript-код, создайте для этого элемента поведение Call JavaScript. Для этого вызовите одноименный пункт меню поведений. После этого на экране появится диалоговое окно Call JavaScript, показанное на рис. 13.7.
Рис. 13.7. Диалоговое окно Call JavaScript
В этом окне находится единственное поле ввода JavaScript, в котором вводится нужный программный код. Это может быть, например, вызов какой-либо функции, написанной вами и помещенной в секцию заголовка страницы, вызов метода, принадлежащего какому-либо элементу или объекту, или иной код. Не забудьте только нажать кнопку ОК после того, как введете этот код.