Как предотвратить эффект липкого наведения для кнопок на сенсорных устройствах ⇐ CSS

[Anonymous]

Я создал карусель с кнопками «Предыдущая» и «Следующая», которые всегда видны. Эти кнопки имеют состояние при наведении, они становятся синими. На сенсорных устройствах, таких как iPad, состояние наведения закреплено, поэтому после нажатия кнопка остается синей. Я этого не хочу.

• Я мог бы добавить класс без наведения при касании для каждую кнопку и создайте
  мой CSS следующим образом: button:not(.no-hover):hover { background-color:
  blue; , но это, вероятно, очень плохо сказывается на производительности и не позволяет
  правильно работать с такими устройствами, как Chromebook Pixel (который имеет
  сенсорный экран и мышь).
  Я мог бы добавить класс touch в documentElement и сделать свой CSS
  следующим образом: html:not(.touch) button:hover { цвет фона: синий;
  Но это также не работает на устройствах с сенсорным экраном и
  мышью.

Что бы я хотел предпочтение — удаление состояния наведения при касании. Но не похоже, что это возможно. Фокусирование на другом элементе не удаляет состояние наведения. Нажатие на другой элемент вручную помогает, но я не могу вызвать это в JavaScript.

Все решения, которые я нашел, кажутся несовершенными. Существует ли идеальное решение?

Подробнее здесь: https://stackoverflow.com/questions/172 ... ch-devices