Question

I want to change the cursor to cell(thick plus sign) on the hover of table cell

i used

tr:hover td {
    cursor: cell;
}

Looks like it doesnot work in chrome, but works in firefox.

list of cursors
http://www.css3.com/css-cursor/
and
http://www.sitepoint.com/css3-cursor-styles/#fbid=2MQ0iRM9or2
say that it is supported in chrome.

one work aroud can be creating an image for the cursor.

i am looking any other better workaround/

or what are the best practices for managing cursors for different browsers.

Answer 1

In Firefox, the cell cursor seems to default to a cross-hair. I would simply set your cursor and leave it to the browser to then decide what to do with it. In other words, keep the CSS you have, and so long as the cursor you want is a standard in the specs, it’ll slowly be adopted over time and have a level of graceful degradation.

Your other option is to use JavaScript. If you like jQuery, there seem to be a few plugins around that will do this with an image.

Here’s one I dug up that seems simple enough:

http://jquery.kidsil.net/examples/customcursor/example.html

Good luck!