javascripthtmlcsshyperlinkmouse-cursor

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 style to pointer for links without using the href attribute?

I know I can add href="#". I have this in a lot of places in the html document, and would like to know how to make cursor style pointer for links without using the href attribute.

Solution

  • in your css file add this....

    a:hover {
 cursor:pointer;
}

    if you don't have a css file, add this to the HEAD of your HTML page

    <style type="text/css">
 a:hover {
  cursor:pointer;
 }
</style>

    also you can use the href="" attribute by returning false at the end of your javascript.

    <a href="" onclick="doSomething(); return false;">a link</a>

    this is good for many reasons. SEO or if people don't have javascript, the href="" will work. e.g.

    <a href="nojavascriptpage.html" onclick="doSomething(); return false;">a link</a>

    @see http://www.alistapart.com/articles/behavioralseparation

    Edit: Worth noting @BalusC's answer where he mentions :hover is not necessary for the OP's use case. Although other style can be add with the :hover selector.