10

I'm following the standard of W3C here http://www.w3.org/TR/CSS2/ui.html and here http://www.quirksmode.org/css/cursor.html#note. However, the element isn't displayed the hand when mouseover. Please help.

<a style="cursor:pointer;cursor:hand" onclick='javascript:window.open("http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>&amp;t=<?php single_post_title(); ?>", "_blank", "toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=no,resizable=no,copyhistory=no,left=300,top=100,width=626,height=436")'>[image goes here]</a>

When viewing with IE9 and mouseover, it doesn't change the cursor into the "hand", but it's just the regular arrow instead. Please advise.

Thanks!

Improve this question
3
  • Check your DOCTYPE as often IE needs to be in standards compliant mode for this sort of thing to work.
    – Dave Anderson
    Commented Dec 3, 2010 at 7:33
  • 1
    It would be much much easier to just give the anchor a href attribute, such as <a href="#" or <a href="javascript:;"
    – Randy the Dev
    Commented Dec 3, 2010 at 7:40
  • 1
    if i use the "#" syntax, after clicking on the img link, it "kicks" me to the top of the page, thinking there's an anchor in my page. if i use href="javascript:;", it looks kinda ugly when mouseover :(
    – Tam N.
    Commented Dec 3, 2010 at 16:20

4 Answers 4

Reset to default
30

It should be cursor: pointer; alone because hand is a proprietary value only implemented by old versions of IE, and is thus an invalid value.

If you actually care about IE 5.x, though, you switch the two properties around, i.e. (cursor: hand; cursor: pointer, hand comes first). Your CSS will still invalidate though, so I'd rather you not bother.

Improve this answer
0
3

hand is not a valid value for cursor -- it is IE8- legacy. Use pointer.

http://www.w3schools.com/css/pr_class_cursor.asp

Improve this answer
3

in your supplied link:

Value:      [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit

hand is not valid css

in the other link hand is mentioned however it is only supported in ie, excluding ie9 beta, and in opera.

if you are looking for the hand with the pointing indexfinger you want pointer to be the last one mentioned in the css

Improve this answer
0
2

Try leaving out "cursor:hand;". According to the article you refer to, it is only needed for Internet Explorer 5. Unless you are developing a internal web app for a company who still work with that browser, I'd leave it out.

Improve this answer
0

Not the answer you're looking for? Browse other questions tagged or ask your own question.