3

I want to disable the orange highlighting displayed when the user taps a link. I think iOS and Android Browsers support this by using "webkit-tap-highlight-color". Is there a way to do this?

user1493992
  • 31
  • 2
  • are you talking about Outline. Try setting it zero outline:0; – SVS Jul 01 '12 at 07:56
  • 1
    Found this thread https://bugzilla.mozilla.org/show_bug.cgi?id=701690 Have you tried to add styles to :active state? – antejan Jan 11 '13 at 17:25

1 Answers1

0

Only document.querySelector("a, label, button") and change its tagName to other, for example span with appropriate aria value. You also need to change your CSS.

The tap color is hardcoded in fennec/firefox and it cannot be changed like "::selection"/::-moz-selection. Additionally ::-moz-selection is not complete, because it doesn't change image background for selected elements.

Optionally: 

div.tap-detector
{
   position:fixed;
   height:100%;
   top:0rem;
   left:0rem;
   width:100%;
   z-index:1000;
   overflow:hidden;
}

and redirect all click, mousemove, mousedown and mouseup events (and other if used) from div to elements under it. Redirected click shall not use tap-highlighting. Probably scroll gesture you not need to catch - elements with overflow:hidden are "transparent" for scroll gesture.

It is not clear solution and use only if YOU MUST because your boss grumbles.

18C
  • 2,014
  • 10
  • 16