How to change cursor

Question

I have started to explore jQuery and have a question regarding how things look. I have an image that when clicked toggles the navigation bar. When I hover over the image I have the text-select cursor.

How can I change this so it looks the same as when I hover over a href (what looks like a hand pointer)?

Answer 1

With CSS you can do:

img:hover {
    cursor: pointer;
    cursor: hand; /* If you want to support IE < 6. See http://quirksmode.org/css/user-interface/cursor.html#note */
}

Or:

img{
    cursor: pointer;
    cursor: hand;
}

Answer 2

As others said

img {
    cursor: pointer;
    cursor: hand;
}

But if you want to use your 'own' hand, you can set a custom image as cursor:

img {
    cursor:url(img/hand-url.cur), default;
}

Answer 3

Nothing to do with jquery there.

you can use css there

.img:hover{
    cursor: auto

}

All possible cursor styles

Answer 4

Browsers have different names for the pointer :) Cross-Browser:

img {
    cursor: pointer;
    cursor: hand;
}

Answer 5

If you have given it an id then use this:

$("#id").css("cursor","pointer")

Answer 6

If you want to use jquery rather than the preferred css solution others have posted, try something like:

$('#myImage').hover(function() { 
    $(this).css('cursor','pointer'); 
}, function() { 
    $(this).css('cursor','auto'); 
});