hide caret (text cursor) on contenteditable div in internet explorer

Question

I have contenteditable div on which i have file drop and copy-paste image event. By using the color:transparent i am able to hide the blinking cursor on chrome browser. but in IE i came to know "The color of the text cursor in an input on IE is always the inverse of the background color". Source: How do I change the color of the text cursor in an input field in IE?

Is there any alternative way to disable a cursor or change the speed of blinking cursor so it looks like hidden in IE.

Answer 1

You can do it in CSS with:

caret-color: transparent

Doesn't work in IE though. Here is browser support chart .

Answer 2

Assuming you mean changing the caret cursor, otherwise known as the text cursor; there are solutions available, although support for IE is rather limited. Perhaps, if not already, you might find this of some use: Hide textfield blinking cursor

Answer 3

You can do this for IE with this hack:

color: transparent;
text-shadow: 0 0 0 #333333;

You can replace the color ( #333333 ) with whatever text color you need.

Answer 4

Try to use cursor: none

The cursor CSS property specifies the mouse cursor displayed when the mouse pointer is over an element. Source .

Regarding the change of speed of blinking cursor it is not so quick and simple to change, you would need design with JavaScript a new "component" for that, but fortunately they are several tutorial or resource online.

 #test { width: 256px; height: 256px; background-color: red; cursor: none; } 

 <div id="test"></div>