PDA

Click to See Complete Forum and Search --> : Cursor change to hand

TLMM
08-27-2003, 01:29 PM
I am wondering if this is the best way to ensure the cursor changes to a hand on the hover of a link:

onmouseover="this.style.cursor='hand'"

This is an example of the line where I am using it:

<a href onclick="return OnMoveNext()" onmouseover="this.style.cursor='hand'" style="text-decoration: none"><font face="Tahoma" size="1" color="#C85E00"><b>next &gt; &gt;</b></font></a>

It's strange because the cursor automatically becomes a hand on some pages without setting it in the code, but it doesn't do it on other pages. Anyone know why?

Thanks.
pyro
08-27-2003, 01:35 PM
Yes, hand is M$ proprietary crap... Try cursor: pointer, but it will still only work for those with JS enabled with your method...
pyro
08-27-2003, 01:40 PM
Here is the non-JavaScript, valid way of doing it:

<style type="text/css">
a.link {
color: #c85e00;
background-color: transparent;
font-face: tahoma, verdana, arial, sans-serif;
font-size: 65%;
text-decoration: none;
font-weight: bold;
cursor: pointer;
}
</style>
</head>
<body>
<p><a href onclick="return OnMoveNext()" class="link">next &gt; &gt;</a></p>
gcrowan
08-27-2003, 02:01 PM
Without defining the "href" it is not considered a hyperlink and will not get a hand. Some anchor tags are used for jumping to specific locations within a page and you would not want a hand on every anchor. For example:
<a name="sectionA">Section A</a>
<a href="#sectionA">Go To Section A</a>

Try this:

<a href="#.html" onclick="return OnMoveNext()" style="text-decoration: none;font:7pt Tahoma;color:#C85E00"><b>next &gt; &gt;</b></a>

Font tags are depreciated and will be phased out in later versions. All fonts will be defined within the style sheet or as an inline style attribute.
pyro
08-27-2003, 02:08 PM
Ach. I just copied the code and didn't look at the <a> tag. This should be better:

<style type="text/css">
a.link {
color: #c85e00;
background-color: transparent;
font-face: tahoma, verdana, arial, sans-serif;
font-size: 65%;
text-decoration: none;
font-weight: bold;
cursor: pointer; /*You shouldn't need this anymore*/
}
</style>
</head>
<body>
<p><a href="nojs.htm" onclick="return OnMoveNext(); return false;" class="link">next &gt; &gt;</a></p>[/code]The nojs.htm page is what uses without JavaScript will get.