iPad Safari：リンクがヒットしたときに高速点滅効果を無効にする方法

それを無効にする方法はありますか？
私はブラウザでのみ意味します...リンク、ボタン、またはクリック機能を持つdivをクリックすると、すばやくクリックした場所で灰色のボックスが点滅します。これを防ぐにはどうすればよいですか？

ipad mobile-safari

— ネコ
ソース

なぜあなたはしたいですか？これは、ユーザーが実際に何かをアクティブにしたことをユーザーに知らせるためです...非常に役立ちます。

— Fosco 2010

基本的に、大きな画像の上にdivがあります。ダブルクリックするとズームインします（他の理由でズームオプションを無効にしました）。一度クリックすると、ツールバーが表示または非表示になります。このdivは透明なので、クリックするたびにちらつくことはしたくありません。ただし、他のほとんどのボタンにはそのままにしています。

— 猫

回答:

216

その要素の-webkit-tap-highlight-colorプロパティに透明色を設定できます。

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

— ケニーTM
ソース

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

— CrazyTim

とてもクールです。私のモバイルアプリを含むコンテナーdivに追加しましたが、次のようにbody要素にも追加できると想定しています。 }

— B-Money

ちなみに、私がPhonegapで作成しているアプリは、要素をタップすると短いちらつきが発生し続けました。-webkit-tap-highlight-color:transparentすべてに設定すること（つまり*）は魅力のように機能しました。

— チャーリー

チャーリー-表示されている問題は、Webkitが非アクティブになると、ハイライトカラーを一時的にアイテムに適用するように見えるためです。このようなグローバルルールを設定するのではなく-webkit-tap-highlight-color: rgba(0,0,0,0);、ターゲットリンクの非アクティブ状態に追加することで問題が解決します。

— マイケルジョンストン

追加したいだけでwebkit-tap-highlight-color: noneはうまくいきません。実際には、を使用して透明度を設定する必要がありrgba(0,0,0,0)ます。

— マシューパフコフ2014年

PhonegapでモバイルSafariを使用すると、これだけが機能しました。

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

出典：iPhone WebKit CSSアニメーションがちらつきを引き起こす

また、メインパネルでレンダリングを有効にします。

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

出典：webkit-transformのwebkit-transitionでちらつきを防止

— 香ばしい
ソース

心配する必要があるMozillaバージョンはありますか？

— スターリングボーン