outline.js 1.1 KB

1234567891011121314151617181920212223242526272829303132
  1. // outline.js
  2. // based on http://www.paciellogroup.com/blog/2012/04/how-to-remove-css-outlines-in-an-accessible-manner/
  3. (function(d) {
  4. "use strict";
  5. var style_element = d.createElement('STYLE'),
  6. dom_events = 'addEventListener' in d,
  7. add_event_listener = function(type, callback) {
  8. // Basic cross-browser event handling
  9. if(dom_events){
  10. d.addEventListener(type, callback);
  11. } else {
  12. d.attachEvent('on' + type, callback);
  13. }
  14. },
  15. set_css = function(css_text) {
  16. // Handle setting of <style> element contents in IE8
  17. !!style_element.styleSheet ? style_element.styleSheet.cssText = css_text : style_element.innerHTML = css_text;
  18. };
  19. d.getElementsByTagName('HEAD')[0].appendChild(style_element);
  20. // Using mousedown instead of mouseover, so that previously focused elements don't lose focus ring on mouse move
  21. add_event_listener('mousedown', function() {
  22. set_css(':focus{outline:0 !important}::-moz-focus-inner{border:0;}');
  23. });
  24. add_event_listener('keydown', function() {
  25. set_css('');
  26. });
  27. })(document);