iPad Safari: Як вимкнути ефект швидкого мигання, коли посилання потрапило

Чи є спосіб відключити це?
Я маю на увазі лише в браузері ... Коли ви натискаєте посилання або кнопку або div, на якому є функція клацання, він блимає сірим полем, де ви швидко клацнули. Як мені запобігти цьому?

ipad mobile-safari

— кішка
джерело

Чому ти хотів би? Це так, щоб користувач знав, що вони насправді щось активували ... це дуже корисно.

— Фоско,

В основному, у мене є div над великим зображенням. Коли вони двічі клацають на ньому, він збільшується. (Я відключив функцію масштабування з інших причин), і коли ви клацаєте один раз, це дозволяє панелі інструментів відображатися або зникати. Оскільки цей div прозорий, я не хочу, щоб він мерехтів кожного разу, коли вони клацають на ньому. Однак я тримаю його на більшості інших своїх кнопок.

— кішка

Відповіді:

216

Ви можете встановити прозорий колір для -webkit-tap-highlight-colorвластивості цього елемента.

a {
    -webkit-tap-highlight-color: transparent;
}

— kennytm
джерело

тобто:-webkit-tap-highlight-color: rgba(0,0,0,0);

— CrazyTim

Дуже круто, дякую. Я додав його до контейнера div, який охоплює мій мобільний додаток, але припустимо, що ви могли б додати його до елемента body також таким чином: body {-webkit-tap-highlight-color: rgba (0,0,0,0); }

— B-Money

Для запису, додаток, який я роблю в Фонегапі, продовжував коротко мерехтіти, натискаючи на елементи, і це було просто помітно, коли мене зловмисло. Налаштування -webkit-tap-highlight-color:transparentна все (тобто *) працювало як шарм.

— Чарлі

Чарлі - Проблема, яку ви бачите, полягає в тому, що Webkit, здається, ненадовго застосовує колір виділення до елемента, коли він стає неактивним. Замість того, щоб встановлювати глобальне правило таким чином, додавання -webkit-tap-highlight-color: rgba(0,0,0,0);до неактивного стану цільового посилання вирішує проблему.

— Michael Johnston

Просто хочу додати , що використання webkit-tap-highlight-color: noneніяк НЕ працює. Ви насправді повинні встановити прозорість через rgba(0,0,0,0).

— matthewpavkov

Використовуючи мобільне Safari у Фонегапі, спрацювало лише це:

* {  -webkit-backface-visibility:  hidden;
     -webkit-tap-highlight-color:  transparent;
  }

Джерело: анімація CSS iPhone WebKit викликає мерехтіння

Крім того, на головній панелі увімкніть візуалізацію:

div.myPanelOrWhatever 
  {
      -webkit-transform: translate3d(0, 0, 0)
  }

Джерело: Запобігання мерехтінню при переході webkit від webkit-transform

— повторний
джерело

Чи існує версія Mozilla, про яку мені потрібно хвилюватися?

— Стерлінг Борн,