How to disable the orange circle effect when clicking on a link, in a WebView

Question

I'm trying to catch the mouse click location so I wrote an onClick in the body tag, but every time I click on the page the whole page turn orange for a little while. Is there any setting can disable this effet?

Answer 1

According to this thread you can override the default orange outline by overriding

-webkit-tap-highlight-color

with

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

in your css file (you'll need to create a css file and add this if you currently don't have one). The last value of 0 sets the alpha value to effectively render the color invisible (1 being fully visible). If that's not the exact css style you're looking for you can poke around the other webkit styles to find similar declarations.

Props to Joe McCann for the idea.

Answer 2

McStretch answer is correct. Webkit on Android is compiled with this property set to orange, using the css you can override this.

Paste the following in your css:

* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

(sorry, don't know how to add this as a comment to that answer)