iPad Safari: Bir bağlantıya ulaşıldığında hızlı yanıp sönme efekti nasıl devre dışı bırakılır

Bunu devre dışı bırakmanın bir yolu var mı?
Sadece tarayıcıda demek istiyorum ... Bir bağlantıya, bir düğmeye veya üzerinde tıklama işlevi olan bir div'e tıkladığınızda, hızlı bir şekilde tıkladığınız yerde gri bir kutu yanıp söner. Bunu nasıl önleyebilirim?

ipad mobile-safari

— kedi
kaynak

Neden istiyorsun Böylece kullanıcı gerçekten bir şeyi etkinleştirdiklerini bilir ... bu çok yardımcı olur.

— Fosco

Temel olarak, büyük bir görüntünün üzerinde bir div var. Çift tıkladıklarında yakınlaştırır. (Başka nedenlerle yakınlaştırma seçeneğini devre dışı bıraktım) ve bir kez tıkladığınızda, bir araç çubuğunun görünmesine veya kaybolmasına izin verir. Bu div şeffaf olduğundan, her tıkladıklarında titremesini istemiyorum. Ancak, onu diğer düğmelerimin çoğunda tutuyorum.

— kedi

Yanıtlar:

219

Bu öğenin -webkit-tap-highlight-colorözelliğine şeffaf bir renk ayarlayabilirsiniz .

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

— kennytm
kaynak

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

— CrazyTim

Çok güzel teşekkürler. Bunu mobil uygulamamı kapsayan kapsayıcı div'e ekledim, ancak bunu gövde öğesine de şu şekilde ekleyebileceğinizi varsayın: body {-webkit-tap-vurgu-renk: rgba (0,0,0,0); }

— B-Money

Kayıt için, Phonegap'ta yaptığım bir uygulama, öğelere dokunduğumda kısa bir titremeye devam etti ve beni rahatsız etmesi dikkat çekiciydi. -webkit-tap-highlight-color:transparentHer şeyi ayarlamak (yani *) bir cazibe gibi çalıştı.

— Charlie

Charlie - Gördüğünüz sorun, Webkit'in öğe etkin olmadığında öğeye vurgu rengini kısaca uyguladığı görülüyor. Böyle bir genel kural belirlemek yerine -webkit-tap-highlight-color: rgba(0,0,0,0);, hedeflenen bağlantının etkin olmayan durumuna eklemek sorunu çözer.

— Michael Johnston

Sadece kullanarak bu eklemek istediğiniz webkit-tap-highlight-color: nonegelmez değil çalışır. Aslında üzerinden şeffaflığı ayarlamalısınız rgba(0,0,0,0).

— matthewpavkov

Phonegap'ta mobil Safari kullanıldığında, yalnızca bu işe yaradı:

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

Kaynak: iPhone WebKit CSS animasyonları titremeye neden oluyor

Ayrıca, ana panelde oluşturmayı etkinleştirin:

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

Kaynak: Webkit dönüşümünün webkit geçişinde titremeyi önleyin

— arındırıcı
kaynak

Endişelenmem gereken bir Mozilla sürümü var mı?

— Sterling Bourne