События click и touchstart странное поведение на мобильном, как решить?

Question

[Anton]

Страница с товаром https://uk-look.com/lyle-scott-camisa-gingham/



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

Так же вижу в консоле ошибку
[Violation] Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

но ее описание мне ничем не помогло...

Интуитивно понимаю что это как то связано с событиями click и touchstart или подобных, но моих знаний javascript не хватает что бы самостоятельно разобраться...

Помогите. Спасибо.

Comments

[imko]

клик оставь просто, нажатие на мобиле тоже клик делает

Answer 1

[Роман Дворянов]

Попробуй в css добавить проверку на hover для элемента списка, мобилки часто ловят ховер перед кликом

@media (hover: hover) {
  .swatch__list--item:hover .swatch__tooltip {
      top: -33px;
      opacity: 1;
      visibility: visible;
  }
}

Про медиазапрос hover можно почитать тут - https://developer.mozilla.org/en-US/docs/Web/CSS/@...