Hi,
I'm trying to write some code that will change the mouse pointer from one custom cursor to another depending on what the user's doing. I know that custom cursors in browsers are a (relatively) new concept, but both IE6 and Firefox 1.5.x and above should be able to handle them, right?
OK, here's my example in action:
http://thegrapevine.brinkster.net/Temp/cursor.html Outside the box the cursor should be white (default), and inside it should be green. Then when the user clicks inside the box it should go blue then green again when the mouse is released.
But in IE6 this only works for the first click before it falls over. And in FF it does not work at all.
Here's the simple code:
<html>
<head>
<style type="text/css">
.table_borders
{
border: 1px solid #333333;
}
</style>
<script language="Javascript">
function cursor1()
{
div1.style.cursor = "url('green.cur')";
window.status = "up";
}
function cursor2()
{
div1.style.cursor = "url('blue.cur')";
window.status = "down";
}
</script>
</head>
<body>
<div class="table_borders" name="div1" id="div1" style="cursor:url('green.cur'); width:400px;height:400px;" onMouseDown="cursor2();" onMouseUp="cursor1();">
click in here
</div>
</body>
</html>
And a link to my two cursors to
test it with:
http://thegrapevine.brinkster.net/Temp/green.cur http://thegrapevine.brinkster.net/Temp/blue.cur Any thoughts, chaps?
Many thanks in advance.
Mark.
