Question

I have a simple pagination script.
When you click the “next” button multiple times in a short period of time, the browser highlights the clickable area. All browsers do this to an element that you click repeatedly.

Is there a way to disable the highlighting of that element?

I feel like I’ve looked everwhere and cannot find an answer.

Thank You!

Answer 1

Very difficult to do this cross-browser. I usually just assume that IE users are used to stuff looking a little off/wont notice the highlight/etc. I use this snippet which uses jQuery but should be adaptable to pretty much any library:

$.fn.disableSelection = function() {
  return $(this).each( function( index, el ) {
    if( typeof el.style.MozUserSelect != 'undefined' ) {
      el.style.MozUserSelect = 'none';
    }
    else {
      el.onmousedown = function() { return false; }
    }
    el.style.cursor = 'pointer';
  } );
}