Disable Blue Highlight when Touch/Press object wit

2019-03-08 14:02发布

问题:

There is a blue highlight that appears whenever a Div that has the cursor:pointer property applied is touched in Chrome. How can we get rid of it?

I have tried the following:

-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;

But they do not effect the blue highlighting on press of a cursor.

回答1:

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

Takes care of the problem, as it sets the highlight color transparent.

Source: http://samcroft.co.uk/2012/alternative-to-webkit-tap-highlight-color-in-phonegap-apps/



回答2:

As far as I have known,Vlad K's answer could cause problems in some android devices.Better solution:

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