Как реализовать hover эффект на мобильных устройствах?

Question

[IvanKalinin]

есть такой макет с ховер эффектом в верхнем правом блоке.
для работы этого эффекта на мобильном устройстве добавлено событие ontouchstart:

<div class="col-sm-4 col-sm-offset-8 flip-container" ontouchstart="this.classList.toggle('hover');">

Проблема заключается в том, что эффект срабатывает только в одном направлении только при первом тапе, т.е. текст назад не возвращается и тапать по экрану бесполезно.

В чем проблема - я найти не смог, может кто подскажет? ощущение что не отрабатывает второй и последующие разы toggle

Answer 1

[Дмитрий Гавриленко]

Ну сделайте еще ontouchend

PS: так-то по идеи, при каждом тапе должен меняться эффект.

Comments

[IvanKalinin]

куда именно?

[Дмитрий Гавриленко]

To_wave: а попробуйте прям в этом тег написать
ontouchend="this.classList.toggle('hover');"

Answer 2

[Глюкъ Виртуален]

Для мобильных устройств придется переделывать поведение элемента.

Comments

[IvanKalinin]

Уже переделал. Вместо ховера добавляю класс при наведении если это не мобильное устройство, а для мобильных сделал кнопку