iPad Safari: Jak wyłączyć efekt szybkiego migania po kliknięciu łącza

Question 1

Czy jest jakiś sposób, aby to wyłączyć?
Mam na myśli tylko w przeglądarce ... Kiedy klikasz łącze, przycisk lub element div z funkcją klikania, miga szare pole, w którym kliknąłeś szybko. Jak temu zapobiec?

Question 2

Możesz ustawić przezroczysty kolor -webkit-tap-highlight-colorwłaściwości tego elementu.

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

Question 3

Używając mobilnego Safari w Phonegap, działało tylko to:

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

Źródło: animacje CSS WebKit iPhone'a powodują migotanie

Na głównym panelu włącz renderowanie:

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

Źródło: Zapobiegaj migotaniu przy przenoszeniu webkit-transformacji do webkit

Answer 1

89

Czy jest jakiś sposób, aby to wyłączyć?
Mam na myśli tylko w przeglądarce ... Kiedy klikasz łącze, przycisk lub element div z funkcją klikania, miga szare pole, w którym kliknąłeś szybko. Jak temu zapobiec?

ipad mobile-safari kot
źródło

4

Dlaczego miałbyś chcieć? Chodzi o to, aby użytkownik wiedział, że faktycznie coś aktywował ... jest to bardzo pomocne.

Fosco

3

Zasadniczo mam element div nad dużym obrazem. Po dwukrotnym kliknięciu powiększa. (Wyłączyłem opcję powiększania z innych powodów), a po jednokrotnym kliknięciu pasek narzędzi pojawia się lub zniknie. Ponieważ ten element div jest przezroczysty, nie chcę, aby migotał za każdym razem, gdy go klikną. Jednak trzymam go na większości moich pozostałych przycisków.

kot

Answer 2

4

Dlaczego miałbyś chcieć? Chodzi o to, aby użytkownik wiedział, że faktycznie coś aktywował ... jest to bardzo pomocne.

Fosco

Answer 3

3

Zasadniczo mam element div nad dużym obrazem. Po dwukrotnym kliknięciu powiększa. (Wyłączyłem opcję powiększania z innych powodów), a po jednokrotnym kliknięciu pasek narzędzi pojawia się lub zniknie. Ponieważ ten element div jest przezroczysty, nie chcę, aby migotał za każdym razem, gdy go klikną. Jednak trzymam go na większości moich pozostałych przycisków.

kot

Answer 4

217

Możesz ustawić przezroczysty kolor -webkit-tap-highlight-colorwłaściwości tego elementu.

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

kennytm
źródło

73

tj .:-webkit-tap-highlight-color: rgba(0,0,0,0);

CrazyTim

Bardzo fajnie, dzięki. Dodałem go do elementu div kontenera, który obejmuje moją aplikację mobilną, ale załóżmy, że możesz dodać go do elementu body w następujący sposób: body {-webkit-tap-highlight-color: rgba (0,0,0,0); }

B-Money

13

Dla przypomnienia, aplikacja, którą tworzę w Phonegap, ciągle migotała podczas stukania w elementy i było to po prostu zauważalne, że mnie wkurza. Ustawienie -webkit-tap-highlight-color:transparentna wszystko (tj. *) Działało jak urok.

Charlie

2

Charlie - Problem, który widzisz, polega na tym, że Webkit wydaje się na krótko nakładać kolor podświetlenia na element, gdy staje się on nieaktywny. Zamiast ustawiać taką globalną regułę, dodanie -webkit-tap-highlight-color: rgba(0,0,0,0);do nieaktywnego stanu docelowego linku rozwiązuje problem.

Michael Johnston,

1

Tylko dodać, że przy użyciu webkit-tap-highlight-color: nonenie nie działa. W rzeczywistości musisz ustawić przezroczystość za pomocą rgba(0,0,0,0).

matthewpavkov

Answer 5

73