in Web and Tech

Disabling User Content Selection on a Web Page

Using CSS:
Use the user-select property to disable the text selection. Use cross-browser prefixes as well to make it work in most browsers and some old browsers.

.no_select {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

Using JQuery:
Bind the events: cut, copy and paste to whichever element and disable the default action. Same with contextmenu.

<script type="text/javascript">
$(document).ready(function (){
    
    $('#some_div').bind('cut copy paste', function (e) {
        e.preventDefault();
    });

    $("#some_div").on("contextmenu",function(e){
        return false;
    });
    
});
</script>

Write a Comment

Comment