当页面作为Web独立应用程序时，webkit-tap-highlight-color行为错误

Question

I'm trying to remove the highlight on tap of a web page in the iPad with the css

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

This works great when using directly the browser in my iPad2. However if I move the page to a web app, with the a nice big icon, the behavior is not any longer working. Weirdo no ?

Setting

document.documentElement.style.webkitTouchCallout = "none";

as pointed in this question does not work

Some ideas, hints are welcomed

Answer 1

The combination of -webkit-tap-highlight-color and -webkit-user-select works for me. You can apply these to an individual element, or html .

html {
    -webkit-tap-highlight-color: rgba(0,0,0,0); 
    -webkit-user-select: none;
}