Click and/or focus outside & -webkit-tap-highlight-color
After several days of hard work, I think that I've found the answers to my questions.


The best element I've found to check for outside click/focus is $(document).

Caveat: When on iPad, the event needs to be touchstart, not click.

I've got a question going here, but here's the "trick" I'm using currently:

var foo = (('ontouchstart' in window) || (window.DocumentTouch &amp;&amp; document instanceof DocumentTouch)) ? 'touchstart' : 'click';


I'm using this technique here to handle focus/click. Essentially, when there's keyboard tab focus, I call click and within that event handler, I call my code to check for outside focus/click/touch.
The idea I had to add a CSS class to &lt;html&gt; works pretty good. When the event handlers are setup to listen for focus/click/touch outside, I add the class. Once there's been focus/click/touch on the outside, I remove the class.

My CSS looks like so:

html.mw-outside * { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }


It kinda feels a little hacky, though.