iPad Safari: So deaktivieren Sie den schnellen Blinkeffekt, wenn ein Link getroffen wurde


87

Gibt es eine Möglichkeit, das zu deaktivieren?
Ich meine nur im Browser ... Wenn Sie auf einen Link oder eine Schaltfläche oder ein Div klicken, auf das eine Klickfunktion angewendet wird, flackert ein graues Kästchen, auf das Sie schnell geklickt haben. Wie verhindere ich das?


4
Warum willst du? Es ist so, dass der Benutzer weiß, dass er tatsächlich etwas aktiviert hat ... es ist sehr hilfreich.
Fosco

3
Grundsätzlich habe ich ein Div über einem großen Bild. Wenn sie darauf doppelklicken, wird es vergrößert (ich habe die Zoomoption aus anderen Gründen deaktiviert) und wenn Sie einmal darauf klicken, wird eine Symbolleiste angezeigt oder ausgeblendet. Da dieses Div transparent ist, möchte ich nicht, dass es jedes Mal flackert, wenn sie darauf klicken. Ich behalte es jedoch auf den meisten meiner anderen Tasten.
Katze

Antworten:


216

Sie können der -webkit-tap-highlight-colorEigenschaft dieses Elements eine transparente Farbe zuweisen.

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

73
dh:-webkit-tap-highlight-color: rgba(0,0,0,0);
CrazyTim

Sehr cool, danke. Ich habe es dem Container div hinzugefügt, der meine mobile App umfasst, aber ich gehe davon aus, dass Sie es auch wie folgt zum body-Element hinzufügen können: body {-webkit-tap-align-color: rgba (0,0,0,0); }
B-Geld

13
Für die Aufzeichnung, eine App, die ich in Phonegap mache, flackerte immer wieder kurz, wenn ich auf Elemente tippte, und es war nur auffällig, mich zu nerven. Das Einstellen -webkit-tap-highlight-color:transparentauf alles (dh *) funktionierte wie ein Zauber.
Charlie

2
Charlie - Das Problem, das Sie sehen, ist, dass Webkit die Hervorhebungsfarbe kurz auf das Element anzuwenden scheint, sobald es inaktiv wird. Anstatt eine solche globale Regel -webkit-tap-highlight-color: rgba(0,0,0,0);festzulegen, wird das Problem durch Hinzufügen zum inaktiven Status des Ziellinks behoben.
Michael Johnston

1
Ich will nur hinzufügen , dass die Verwendung von webkit-tap-highlight-color: nonenicht nicht funktionieren. Sie müssen tatsächlich Transparenz über einstellen rgba(0,0,0,0).
Matthewpavkov

8

Mit Mobile Safari in Phonegap funktionierte nur Folgendes:

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

Quelle: iPhone WebKit CSS-Animationen verursachen Flimmern

Aktivieren Sie außerdem im Hauptfenster das Rendern:

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

Quelle: Verhindern Sie Flimmern beim Webkit-Übergang der Webkit-Transformation


Gibt es eine Mozilla-Version, über die ich mir Sorgen machen muss?
Sterling Bourne
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.