Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Making text unselectable [duplicate]

So, while playing with scrollbars and stuff in HTML5, I'm starting to notice an annoying trend. If I have text near my element that's being dragged (say, a scrub bar for a video, scroll bar, anything a user would click and drag), nearby text will get selected, as if I'm not using a control, just dragging over the page.

This is terribly annoying, and I can't seem to find the right string to search for on google to figure out if it's possible to make certain elements "unselectable".

Anyone know how to do this?

like image 728
Jesse Avatar asked Mar 06 '11 00:03

Jesse


People also ask

How do you make text not copied?

First of all make the element unselectable: -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; This already works in Firefox. To get it work in other browsers, you have to work with pseudo-elements and data-attribute .

How do you make text Uncopyable in HTML?

Use user-select: none; in style attribute or use in a css file.

How do I disable copy feature?

You can allow text selection, but prevent copy and cut functions using the oncopy, oncut and onpaste event attributes. By adding these attributes into a textbox's <input> tag, you can disable cut, copy and paste features. The user is left with the option to enter the field manually with these attributes set.


1 Answers

It varies per browser. These CSS properties will target WebKit and Gecko-based browsers, as well as any future browsers that support user-select:

user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
like image 147
icktoofay Avatar answered Oct 18 '22 02:10

icktoofay