What is the best way to prevent highlighting of text when clicking on its containing div in javascript?
In (Mozilla, Firefox, Camino, Safari, Google Chrome) you can use this:
div.noSelect {
-moz-user-select: none; /* mozilla browsers */
-khtml-user-select: none; /* webkit browsers */
}
For IE there is no CSS option, but you can capture the ondragstart event, and return false;
Update
Browser support for this property has expanded since 2008.
div.noSelect {
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}
https://css-tricks.com/almanac/properties/u/user-select/
You could use this CSS to simply hide the selection color (not supported by IE):
#id::-moz-selection {
background: transparent;
}
#id::selection {
background: transparent;
}