Rambler's Top100 Старый русский почтовик! Оплата в WM! Самый активный, самый надежный!
Рыболовные туры в Финляндию
Рыбалка в Финляндии
с русскоговорящим гидом!
SEO sprint - Всё для максимальной раскрутки!
Форум русских рыболовов Финляндии

Рыбалка в Финляндии


главная
DHTML
таблицы стилей
способы
употребления
Несколько
примеров
Селектор CLASS
мысли о CSS
фильтры
Общие свойства
фильтров
Обработка
событий
Мультэффекты
Терминология
Тег <script>
запрос пользователю
дата и время
Переменные
объекты
Вспомогательные
материалы

Обработчики событий. События, связанные с мышкой.

   Так и подмывает начать статью с нудного описания понятий и терминов, которые волей-неволей придется употреблять в этой статье: событие, объект, свойство и т.д. и т.п. Но тогда придется писать не статью, а учебник - толстый и скучный. А хочется рассказать коротко, весело и доходчиво смайлик о! Ладно, постараюсь коротко: в данном случае событие - это все, что происходит с вашим компьютером: движение мышки, щелчок ее кнопки или нажатие клавиши на клавиатуре, открытие окна или загрузка в него страницы. Обработчик события в данном случае - это маленький блок JavaScript, который производит определенное действие (по нашему желанию), когда случается какое-то событие.
   Обработчики событий принадлежат JavaScript, но они скорее «встроены» в HTML-код, а не существуют самостоятельно. Они входят в структуру документа НТМL, не требуя команд <SCRIPT> и </SCRIPT>. Сами они не скрипты, а скорее область взаимодействия между вашей страницей и читателем и поэтому для их использования необязательно писать отдельные программки, а достаточно лишь связать их с определенными тегами. В связи с этим сразу небольшой комментарий.
   В JavaScript событий много, сегодня мы поговорим только о тех, которые связаны с мышкой. Таких набирается всего семь. Я приведу несколько примеров употребления обработчиков в надежде, что Вы сможете использовать их как основу при реализации своих идей.
   Первый пример самые любопытные из Вас уже могли наблюдать: при наведении курсора мышки на слово "комментарий", выделенное синим шрифтом, открывается всплывающее окно с небольшим пояснением по теме. Обращаю Ваше внимание: не после клика по ссылке, а только при наведении курсора на это слово. В общем-то, это и не ссылка в обычном понимании: это просто слово, заключенное в тег FONT, синим цветом я его выделил специально, чтобы заметно было. Это окошко и есть результат обработки события "onMouseOver" - (наведение курсора на объект). Как это реализовано, Вы можете посмотреть, кликнув по странице правой кнопкой мыши и выбрав из меню "Просмотр ХТМЛ-кода".
   Событий, связанных с мышкой, как я уже сказал, набирается семь:
 
Имя событияАтрибут HTML Условие возникновения события
MouseOver onMouseOverПомещение указателя мыши в область элемента (то есть указатель наведен на элемент)
MouseOut onMouseOut Курсор мыши уходит за пределы элемента
onMouseMove onMouseMove Курсор мыши перемещается в пределах области элемента
MouseDown onMouseDown Нажата любая кнопка мыши, когда курсор находится в области элемента
MouseUp onMouseUp Отпущена раннее нажатая любая кнопка мыши, когда курсор находится в области элемента
Click onClick Щелчок левой кнопки мыши на элементе
DblClick onDblClick Двойной щелчок левой кнопки мыши на элементе

   Итак, мы выяснили для себя, что можем заставить браузер посетителя нашего сайта реагировать на выбранное нами событие в нужном для нас месте поместив в тег элемента название события и, указав обработчику объект, с которым необходимо работать и метод, т.е. команду, которую необходимо выполнить или свойство, которое необходимо придать этому объекту. Объекты могут быть разные и свойств у них, а также методов их обработки тоже много.
   Два примера мы уже имеем: первый - событие onMouseOver открывает всплывающее окно. А где второй? А второй в этом самом всплывающем окне! Если мы кликнем по фразе "Щелкните здесь, чтобы закрыть это окно" - окно закроется. В этом случае событие onClick заставляет обработчик выполнить команду self.close (закрой себя).
   Посмотрим еще несколько примеров:
  • Пример первый:
    Сделайте здесь двойной щелчок левой кнопкой мыши.
  • Пример второй:
    Наведите курсор мышки на слова строка состояния, выделенные красным. ОП! Вот это да! А теперь, не уводя курсора, нажмите кнопку мыши. Ничего не произошло? Тогда отпустите кнопку и посмотрите на строку состояния Вашего браузера. К сожалению, убрать эту надпись можно только заменив на другую. Вернуть строку состояния в первоначальное состояние :-) невозможно? А вот вернуть цвет фона странице - возможно. Для этого уберите курсор в сторону. Но заметьте, что это происходит не само собой, а тоже по нашей команде! То есть, что же это получается? А получается, что мы можем в одном теге задавать обработчику событий сколь угодно много (в разумных пределах, конечно!) команд, и он их все выполнит!
   Вот так, коротко... Просто несколько примеров...
   И в конце небольшой совет: помните истину - все хорошо в меру. Меня, например, просто бесят сайты, в которых напихано всяких ненужных скриптов и эффектов! То есть, если они поставлены к месту, их, в общем-то и не замечаешь. Но если я захожу на сайт в поисках нужной мне инфы, а вместо нее сначала выскакивает окошко "как тебя зовут?", а после ответа выскакивает следующее: "а сколько тебе лет?" и после следующего - опять вместо нужной мне информации: "О! Ты такой старый, а на нашем сайте первый раз!" - будьте уверены, что это будет и последний раз!
   И последнее! Я Вас умоляю, не ставьте в Активные Системы Раскрутки страницы со скриптами и прочими излишествами! Сделайте для САР "облегченный" вариант страницы! В противном случае Вы получите эффект, совершенно противоположный ожидаемому!

Создать свой сайт


Рейтинг@Mail.ru liveinternet.ru: показано число посетителей за сегодня


Copyright © 2001 by Сергей Червонящий.
Все права защищены. Запрещено частичное или полное воспроизведение материалов сайта без согласования с автором.

Покупайте на OHO.ru:
Покупайте на OHO.ru: