Когда пользователь прикасается к ссылке или элементу, для которого указан обработчик клика, то Safari на iOS подсвечивает этот элемент.
Цвет этой подсветки задается с помощью CSS свойства -webkit-tap-highlight-color.
Свойству можно задать любой цвет, в том числе и с прозрачностью. Это невероятно полезно, чтобы скрыть эту подсветку для блоков, которые обрабатывают события своих дочерних элементов.
Предположим, что нас интересует только клик по элементу с классом item__add
.
$(".list").on("click", ".item__add", function () { … });
Но подсветка будет активироваться у элемента с классом list
, так как именно на него повешен обработчик события. Исправим это CSS свойством в селекторе .list
.
.list {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
Коментарии к заметке
О, спасибо. У меня как раз была такая фигня в одном месте на новом хомяке.
На доброе здоровье, Артём. У меня такого полным полно в проектах. Тут вот плотненько занялся оптимизацией под тач-устройства и столько всего нужно подкрутить и допилить оказывается. Сейчас ещё ковыряюсь со «свайпами» и профилированием CSS.
И от меня спасибо :) Никогда не задумывался, можно ли отключить, но теперь буду использовать в мобильных версиях