CODEWITHSUNDEEP
androidcsswebviewcordova
JavaScript Warrior
JavaScript Warrior

Reputation: 763

Disable orange highlight on a div in WebView

I am making an PhoneGap Android app, and can't turn off the orange highlighting clickable elements.

I have tried all combinations of CSS: -webkit-tap-highlight-color, -webkit-focus-ring-color and -webkit-user-modify, as suggested in

Disable orange outline highlight on focus
Disable orange highlight around links in Android

Here is what I have, and it's not doing anything: 

`* {  
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;   
    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;  
    outline: none !important;  
    -webkit-user-modify: read-write-plaintext-only !important;  
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}`

I'm using Phonegap 2.9.0 and Android 4.1.2, and Calendario plugin from here:
http://tympanus.net/codrops/2012/11/27/calendario-a-flexible-calendar-plugin/

Is there any hope for disabling this unsightly organe thing?

Upvotes: 2

Views: 4445

Answers (3)

rotoxl
rotoxl

Reputation: 159

Maybe you are talking about the outline set by focus, so this should help (not tested):

div:focus, div:active {
    outline: none;
}

Upvotes: 9

sourav
sourav

Reputation: 676

You can try by using 

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

Upvotes: 4

Evan Stoddard
Evan Stoddard

Reputation: 708

div{
-webkit-appearance:none;
}

Upvotes: 1

Related Questions