Can I change the blinking caret in a form/text area in a browser?

html cursor caret
Dave picture Dave · May 23, 2011 · Viewed 8.1k times · Source

I want to have a custom text caret in my text field for my web page. I would like to have an old school block type blinking caret. Is this possible?

Answer

colinross picture colinross · May 23, 2011

The simple answer is you can't (change the user's blinking caret) via javascript, html, or css as that is created and managed by the chrome (the browser beyond the DOM)

Wanna fake it? http://www.dynamicdrive.com/forums/showthread.php?t=17450

The code examples shown are pretty old, but the idea remains the same-- Make a blinking box and have it tail the input...

With thats all said, I highly suggest against using it in anything but the smallest, niche, 'for fun' way as having a javascript function fire and be altering the DOM on every keyDown is bordering on user abuse imho.

Related questions

JavaScript get word before cursor

Okay, I've been looking all over the web to find a solution but I couldn't find one, is there a way to get the word before the caret position in an editable div so a bit like: This is some| …

Read More
Change cursor to hand when mouse goes over a row in table

How do I change the cursor pointer to hand when my mouse goes over a <tr> in a <table> <table class="sortable" border-style:> <tr> <th class="tname">Name</th&…

Read More
how to set cursor style to pointer for links without hrefs

I have a lot of <a> html tags without the href attribute for making onclick javascript calls. These links do not have a pointer style of cursor. They have text style cursor. How can I set the cursor …

Read More