Чем хороши события наведения мыши?

Question

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

Кроме того, можно предположить (как и я), что click без предыдущего mouseover - это то, что должно происходить на мобильном устройстве.видя, что мыши нет.

Но мобильные браузеры (Safari на iOS) фактически запускают наведение мыши непосредственно перед click.Поэтому любой шанс сделать что-то полезное во время mouseover теперь бессмыслен.

Итак, мы не хотим предпринимать действия (отображать / анимировать что-либо) во время наведения мыши, так как на мобильных устройствах это событие происходит немедленнодо щелчка.

И мы не можем использовать наличие события наведения мыши в качестве индикатора того, что у пользователя есть мышь.

Так что, если реально, безопасно использовать наведение мышисобытие и для каких целей?

Answer 1

Навыки мыши все еще полезны для экземпляров пользовательского интерфейса, и я бы сказал, что это безопасно.

Некоторые примеры:

• Наведите указатель мыши на ссылку, затем активируйте более темный шрифт и подчеркните ссылку
• Перемещение вкладки в меню (например, "история просмотров" Amazon или корзина для покупок)
• Наведите изображение на странице товара для увеличения фотографий

Если вы когда-нибудь почувствуете, что наведение мыши помешает вашей мобильной версии веб-сайта, вы всегда можете задать медиазапросы.

Answer 2

Мой совет: никогда не заставляйте «действенный» поповер полагаться на наведение мыши, и чтобы кнопки / ссылки всегда выглядели кликабельными, не полагаясь на эффект наведения мыши / наведения мыши.

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

Так для чего они хороши? Сайты электронной коммерции часто пользуются всплывающими «быстрыми просмотрами», чтобы показать дополнительные изображения товара, к которым также можно получить доступ, нажав на элемент. Стили и анимация при наведении курсора эстетически приятны, когда они усиливают общее ощущение веб-сайта и ведут себя единообразно во всей системе дизайна, как в Google Material Design.