Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Уроки веб-дизайна с подробными примерами #17


Информационный Канал Subscribe.Ru

Здравствуйте, уважаемые подписчики!

Представляю Вашему вниманию семнадцатый выпуск рассылки "Уроки веб-дизайна в примерах". В этом выпуске мы продолжим изучения технологии создания динамических сайтов.


Содержание выпуска:
DHTML (часть 2)

Событие onMouseDown возникает при нажатии левой кнопкой мыши. В следующем примере при нажатии кнопки мыши на тексте меняется стиль оформления текста (текст выделяется жирным шрифтом).

КодОтображение
<p onMouseDown="this.style.fontWeight='bold'">Пример использования события onMouseDown.</p>

Пример использования события onMouseDown.

Событие onMouseUp возникает при отпускании нажатой левой кнопки мыши. В следующем примере нажатии кнопки мыши на тексте меняется стиль текста, а при отпускании стиль становится первоначальным.

КодОтображение
<p onMouseDown="this.style.fontWeight='bold'" onMouseUp="this.style.fontWeight='normal'">Пример использования события onMouseDown и onMouseUp.</p>

Пример использования события onMouseDown и onMouseUp.

Событие onMouseOver возникает при наведении курсора мыши на элемент. В следующем примере на наведении курсора мыши на текст появляется рамка.

КодОтображение
<div onMouseOver="this.style.borderWidth='1';this.style.borderstyle='dotted'">Пример использования события onMouseOver.</div>
Пример использования события onMouseOver.

Событие onMouseMove возникает при наведении курсора мыши на элемент. В следующем примере на наведении курсора мыши на текст изменится цвет текста.

КодОтображение
<font onMouseMove="this.style.color='red'" onMouseOver="this.style.color='blue'">Пример использования события onMouseMove.</font> Пример использования события onMouseMove.

Событие onMouseOut возникает при перемещения указателя мыши за границы объекта. Следующий пример демонстрирует последовательность событий onMouseOver, onMouseMove и onMouseOut. Каждое из этих событий меняет цвет текста (соответственно на синий, красный и зеленый):

КодОтображение
<font onMouseOver="this.style.color='blue'" onMouseMove="this.style.color='red'" onMouseOut="this.style.color='green'">Пример использования события onMouseOut.</font> Пример использования события onMouseOut.

Событие onFocus возникает при получении объектом фокуса при переходе по клику мыши или с помощью клавиатуры. Это событие может быть описано для тегов LABEL, INPUT, SELECT, TEXTAREA и BUTTON. В следующем примере при клике на поле ввода текста, поясняющий текст исчезает (этот способ удобен для создания компактных и понятных форм, подсказка находится в самом поле и исчезает, при вводе в это поле информации):

КодОтображение
<INPUT value="Введите ваше имя" onFocus="this.value=''">

Событие onBlur возникает при потере объектом фокуса при переходе по клику мыши или с помощью клавиатуры. Это событие может быть описано для тегов LABEL, INPUT, SELECT, TEXTAREA и BUTTON. В следующем примере при клике на поле ввода текста, поясняющий текст исчезает (событие onFocus) и при переходе фокуса, если пользователь ничего не ввел, подсказка появляется снова (событие onBlur):

КодОтображение
<INPUT value="Введите ваше имя" onFocus="this.value=''" onBlur="if (this.value==''){this.value='Введите ваше имя'}">
Новости сайта

Добавлен ряд статей в различных разделах.

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

P.S. Если Вы используете почтовую программу The Bat!, то письмо может отображаться некорректно. Для того, чтобы просмотреть правильный вариант, щелкните два раза на аттачменте Part.html и откройте письмо (кнопка "No/Нет").


Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора
Подписан адрес:
Код этой рассылки: comp.design.www
Архив рассылки
Отписаться
Вспомнить пароль

В избранное