Android 4.1.2 の Phonegap 3.0 アプリで要素をタップすると、恐ろしいハイライトを完全に取り除くのに問題があります。
いくつかの要素をタップすると、最初にタップされた要素の下にオレンジ色 (この場合) のハイライトが表示されますが、すぐに親要素 (または別の祖先要素、どちらか不明)もハイライト表示されます!
透明色を設定することでタップハイライトを「無効」にできることを知っています:
* {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent; /* For some Androids */
}
これは、アプリ内のほとんどのクリック可能な要素で実際に機能しますが、一部の要素では、親/祖先要素がまだ強調表示されます! テストしているデバイス(Samsung Galaxy S3)でどのように見えるかを示すデモを作成しました。はい、そのとおり。私はjsfiddleをアニメーションツールとして使用しています:-)
別のスレッドで説明されているすべてを試しました: Disable orange Outline Highlight on focus。
上記のCSSルールでタップされたすべての要素でタップハイライトが実際に消えるため、この2番目に大きなハイライトがタップ以外の何かを示しているのではないかと疑い始めています. しかし、cssルールを拡張して適用しようとしましたが、*:hover, *:active, *:focus
成功しませんでした。
私はまた、CSS の外部と Android アプリ自体の問題を攻撃しようとしました。WebSettings の最初の setLightTouchEnabled()は有望に見えましたが、A) 機能しませんでした。B) API レベル 18 以降は廃止され、効果がありません。
私はここで本当に途方に暮れています。どんな助けでも大歓迎です。