Disable Text Selection in IE

Question

I am trying to disable text selection, and it works fine in all browsers but IE. I have added a bit of code to the css as well as to the index. It still is not disabling.

I have added this to the index:

$('#poet').disableSelection(); // deprecated in jQuery UI 1.9

$(el).attr('unselectable','on')
.css({'-moz-user-select':'-moz-none',
       '-moz-user-select':'none',
       '-o-user-select':'none',
       '-khtml-user-select':'none', /* you could also put this in a class */
       '-webkit-user-select':'none',/* and add the CSS class here instead */
       '-ms-user-select':'none',
       'user-select':'none'
 }).bind('selectstart', function(){ return false; });

 $("#123").bind( "selectstart", function(e){
    e.preventDefault();
    return false;
});

 $("#123").bind("selectstart", function (evt) {
    evt.preventDefault();
});

And this to the .css file:

* {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none; 
-ms-user-select:none;
}

Any help would be greatly appreciated. Thank you.

score -1 · Accepted Answer · edited May 23 '17 at 11:50

-1

Add both of these to your existing CSS class

-webkit-touch-callout: none;
user-select: none;

Additionally, you can check this link for more details.

http://msdn.microsoft.com/en-us/library/ie/jj152140(v=vs.85).aspx

Prevent text selection when dragging from outside target in IE7/8

Given that this post specifies "jquery" :

$("#inputID").focus(function() {
    $(this).blur();
}):

edited May 23 '17 at 11:50

Community

1
1

answered Oct 07 '13 at 20:25

adam

2,930
7
54
89

2

How would a new `-webkit` be helpful in making it work with `IE` ? – XCS Oct 07 '13 at 20:26
@Cristy By looking at his code sample it's apparent that he's trying to disable selection for all browsers (including IE). These were the only two missing from his class to complete that. – adam Oct 07 '13 at 20:28
Thank you very much for the help @adam, but for some reason it is still not working. My code now contains: /**STOP_HIGHLIGHTING**/ * { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } – Michael Carafa Oct 08 '13 at 14:38
and the javascript contains: $(el).attr('unselectable','on') .css({'-moz-user-select':'-moz-none', '-moz-user-select':'none', '-o-user-select':'none', '-khtml-user-select':'none', '-webkit-user-select':'none', '-ms-user-select':'none', 'user-select':'none' }).bind('selectstart', function(){ return false; }); $("#123").bind("selectstart", function (evt) { evt.preventDefault(); }); $("#inputID").focus(function() { $(this).blur(); }): – Michael Carafa Oct 08 '13 at 14:39
@adam I am much more skilled with HTML and CSS, as for jQuery goes, I just copy and paste code I find, and have done a few lessons in code academy. Could you explain what jQuery blur means? I do have this at the end: $("#inputID").focus(function() { $(this).blur(); }): – Michael Carafa Oct 08 '13 at 14:41
@adam going against conventions, I even tried adding !important to each item to no avail. – Michael Carafa Oct 08 '13 at 14:44
If you're not familiar with using jQuery and ready to try a jQuery solution, you may want to think about not tagging the post with 'jQuery' =P – adam Oct 08 '13 at 14:52
@adam I have tried one by one unlinking all linked files to see if one of them was causing a conflict. Nothing. I am running IE 8, does that help? – Michael Carafa Oct 08 '13 at 14:53
@adam Haha I am sorry, after the CSS solution did not work I saw a jQuery solution online and thought I'd give it a shot. – Michael Carafa Oct 08 '13 at 14:53
Check this link out: http://stackoverflow.com/questions/9692036/prevent-text-selection-when-dragging-from-outside-target-in-ie7-8 – adam Oct 08 '13 at 14:54
@MichaelCarafa Glad you eventually got something that will work. Will you please update your OP with the working solution. – adam Oct 08 '13 at 15:04

Disable Text Selection in IE

1 Answers1