javascript - Disable Text Selection in Chrome

Question

I am building a touchscreen kiosk that will use Google Chrome to display the content. There is no keyboard except for a virtual keyboard that will pop up for entering name info on certain screens. Nowhere on the kiosk will a user need to select anything.

When I place my finger anywhere on the screen and drag it around, the blue selection fields start appearing. I have got to do away with that.

Initially I was using Opera, which has a config feature for disabling text selection. I couldn't find the equivalent for this in Chrome.

Anyone know if there IS a config for this in Chrome, or alternatively what Javascript will accomplish this?

Answer 1

Why not simply use CSS to remove the selection effect instead of relying on Javascript?

*::selection {
    background:transparent;
}

*::-moz-selection {
    background:transparent;
}

*::-webkit-selection {
    background:transparent;
}

/* DO NOT COMBINE... IF COMBINED, IT WILL REFUSE TO WORK */
/* FOR CHROME 5+ (untested in 4), ONLY ::SELECTION IS REQUIRED */

Selection will still be possible, but there will not be any blue rectangles. In fact, selection will be totally invisible to the user.

For what I can read from your scenario, you are just trying to get rid of the selection rectangles.