javascript onclick自定义光标

javascript onclick custom cursor

本文关键字：光标 自定义 onclick javascript      更新时间：2023-09-26

我一直在使用：

    <script>
function change()
{
document.body.style.cursor="url('xx/xx.cur'),auto";
}
</script>
<div onClick="change()"></div>

它可以工作，但重要的是，当没有点击时，光标会重置，所以我尝试了onBlur，但它不起作用。

最后我发现了这个：

<script type="text/javascript"> 
   function change() { 
   document.body.style.cursor=(document.body.style.cursor=="help") ? "default" : "help"; 
} 
</script> 
</head> 
<body> 
<div onmousedown="change()" onmouseup="change()">  </div>

它的工作原理很有魅力，但它未能用custom.curs.取代光标标准样式

此处：

    function change()
{
document.body.style.cursor=(document.body.style.cursor=="url ('xx/xx3.cur')") ? "url ('xx/xx1.cur')" : "url ('xx/xx3.cur')";
}
</script>
</head>
<body>
<div onmousedown="change()" onmouseup="change()" id="container">

显然，双括号很麻烦。我尝试了一切都没有成功。得到任何帮助。提前谢谢。

我可能会用一些简单的css魔术来解决这个问题。

我不想用javascript给body.style.cursor赋值，而是在html标记上切换一个类，然后显示正确的光标。

CSS：

html
{
    cursor: default;
}
html.help
{
    cursor: url('help.cur');
}

Javascript：

function change()
{
    $("html").toggleClass("help")
}

工作jsfiddle：http://jsfiddle.net/BV3kn/2/

相关文章：