iPad Safari: как отключить эффект быстрого мигания при нажатии на ссылку

Question 1

Есть ли способ отключить это?
Я имею в виду только в браузере ... Когда вы нажимаете ссылку, кнопку или div, который имеет функцию щелчка по нему, он мигает серым квадратом, в котором вы быстро щелкнули. Как мне предотвратить это?

Question 2

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

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

Question 3

Используя мобильный Safari в Phonegap, работало только это:

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

Источник: CSS-анимация iPhone WebKit вызывает мерцание

Также на главной панели включите рендеринг:

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

Источник: Предотвращение мерцания при переходе через webkit из webkit-transform

Answer 1

89

Есть ли способ отключить это?
Я имею в виду только в браузере ... Когда вы нажимаете ссылку, кнопку или div, который имеет функцию щелчка по нему, он мигает серым квадратом, в котором вы быстро щелкнули. Как мне предотвратить это?

ipad mobile-safari кошка
источник

4

Зачем тебе это нужно? Это значит, что пользователь знает, что он действительно что-то активировал ... это очень полезно.

Fosco

3

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

cat

Answer 2

4

Зачем тебе это нужно? Это значит, что пользователь знает, что он действительно что-то активировал ... это очень полезно.

Fosco

Answer 3

3

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

cat

Answer 4

217

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

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

Kennytm
источник

73

то есть:-webkit-tap-highlight-color: rgba(0,0,0,0);

CrazyTim

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

B-Money

13

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

Чарли

2

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

Майкл Джонстон

1

Просто хочу добавить , что использование webkit-tap-highlight-color: noneникак не работает. На самом деле вам нужно установить прозрачность через rgba(0,0,0,0).

matthewpavkov

Answer 5

73