2017-10-25 05:32:33 -05:00
|
|
|
// based on http://www.paciellogroup.com/blog/2012/04/how-to-remove-css-outlines-in-an-accessible-manner/
|
|
|
|
function outlineFixer() {
|
2018-08-26 10:14:40 -05:00
|
|
|
const d: any = document;
|
2017-10-25 05:32:33 -05:00
|
|
|
|
2018-09-03 04:00:46 -05:00
|
|
|
const styleElement = d.createElement('STYLE');
|
|
|
|
const domEvents = 'addEventListener' in d;
|
2017-10-25 05:32:33 -05:00
|
|
|
|
2018-09-03 04:00:46 -05:00
|
|
|
const addEventListener = function(type, callback) {
|
2017-10-25 05:32:33 -05:00
|
|
|
// Basic cross-browser event handling
|
2018-09-03 04:00:46 -05:00
|
|
|
if (domEvents) {
|
2017-10-25 05:32:33 -05:00
|
|
|
d.addEventListener(type, callback);
|
|
|
|
} else {
|
2017-12-20 05:33:33 -06:00
|
|
|
d.attachEvent('on' + type, callback);
|
2017-10-25 05:32:33 -05:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2018-09-03 04:00:46 -05:00
|
|
|
const setCss = function(cssText) {
|
2017-10-25 05:32:33 -05:00
|
|
|
// Handle setting of <style> element contents in IE8
|
2018-09-03 04:00:46 -05:00
|
|
|
!!styleElement.styleSheet ? (styleElement.styleSheet.cssText = cssText) : (styleElement.innerHTML = cssText);
|
2017-10-25 05:32:33 -05:00
|
|
|
};
|
|
|
|
|
2018-09-03 04:00:46 -05:00
|
|
|
d.getElementsByTagName('HEAD')[0].appendChild(styleElement);
|
2017-10-25 05:32:33 -05:00
|
|
|
|
|
|
|
// Using mousedown instead of mouseover, so that previously focused elements don't lose focus ring on mouse move
|
2018-09-03 04:00:46 -05:00
|
|
|
addEventListener('mousedown', function() {
|
|
|
|
setCss(':focus{outline:0 !important}::-moz-focus-inner{border:0;}');
|
2017-10-25 05:32:33 -05:00
|
|
|
});
|
|
|
|
|
2018-09-03 04:00:46 -05:00
|
|
|
addEventListener('keydown', function() {
|
|
|
|
setCss('');
|
2017-10-25 05:32:33 -05:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
outlineFixer();
|