В вычислении , в MouseOver , парение мыши или парение окно представляет собой графический элемент управления , который активируется , когда пользователь перемещает или парит указатель над зоной запуска, как правило , с помощью мыши , но также возможно с цифровым пером . Элементы управления наведением курсора мыши широко распространены в веб-браузерах . Например, при наведении указателя мыши на гиперссылку элемент управления наведением указателя мыши отображает URL-адрес в строке состояния . Дизайнеры сайтов могут определять свои собственные события наведения курсора, используя JavaScript [1] илиКаскадные таблицы стилей . [2]
События наведения мыши часто используются в веб-дизайне и программировании графического пользовательского интерфейса .
Он также известен как ролловер, который относится к кнопке, созданной веб-разработчиком или веб-дизайнером, находящейся на веб-странице и используемой для обеспечения взаимодействия между пользователем и самой страницей. Термин ролловер в этом отношении происходит от визуального процесса «наведения курсора мыши на кнопку», заставляющего кнопку реагировать (обычно визуально, путем замены исходного изображения кнопки другим изображением), и иногда приводящего к изменению в сети. сама страница. Часть термина «ролл», вероятно, относится к более старым мышам, у которых был механический узел, состоящий из жесткого резинового шарика, размещенного в основании мыши (который катится), в отличие от современной оптической мыши, у которой нет подвижных частей.
Ролловеры могут быть выполнены с помощью изображений, текста или кнопок. Пользователю требуются только два изображения / кнопки (с возможным добавлением текста «alt» к этим изображениям) для выполнения этого интерактивного действия. Ролловер изображений может быть выполнен программой со встроенным инструментом или написанием скрипта. Пользователь должен будет выбрать первое изображение и выбрать альтернативное вторичное изображение. Действие мыши должно быть установлено на «щелкнуть» или «навести указатель мыши», чтобы сработал наведение курсора. При наведении курсора мыши на изображение появляется альтернативное изображение / вторичное изображение, но не остается - когда пользователь «выводит указатель мыши», отводя указатель мыши от изображения, исходное исходное изображение появляется снова. [ необходима цитата ]
Подсказка
Специальное использование события mouseover - всплывающая подсказка, которая показывает краткое описание объекта под курсором. Всплывающая подсказка появляется только после того, как мышь или перо удерживают над объектом в течение определенного времени.
На изображениях они могут быть созданы с использованием атрибута HTML title
. [3]
Примеры
Он не соответствует веб-стандартам. -> < img id = "myImage" src = "/images/myImage.jpg" onMouseOver = "alert ('ваше сообщение');" >
// Код JavaScript без какой-либо структуры < ref > var myImg = document . getElementById ( 'myImage' ); < / ref> function myMessage () { alert ( 'ваше сообщение' ); }if ( myImg . addEventListener ) { // addEventListener - это стандартный метод добавления событий к объектам. myImg . addEventListener ( ' наведение курсора ' , myMessage , ложь ); }else if ( myImg . attachEvent ) { // Для Internet Explorer myImg . attachEvent ( 'onmouseover' , myMessage ); }else { // Для других браузеров myImg . onmouseover = myMessage ; }
// Пример jQuery. Он хорошо деградирует, если в клиентском браузере отключен JavaScript. $ ( "img" ). mouseover ( функция () { предупреждение ( 'ваше сообщение' ); });
Рекомендации
- ^ JavaScript OnMouseOver
- ^ Расширенное меню CSS | Автор: Web Designer Wall
- ^ «Словарь и связанные API для HTML и XHTML» . Проверено 16 февраля 2015 года .
Внешние ссылки
- Скрытое меню CSS Многоуровневое меню наведения указателя мыши на чистом CSS (т.е. без JavaScript).
- DontClick.it Демонстрация навигации только при наведении курсора мыши (требуется Flash Player)