1

私は使用しています:

    <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> 

これは魅力のように機能しますが、カーソルの標準スタイルをカスタム .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">

明らかに、二重括弧は面倒です。私は成功せずにすべてを試しました。どんな助けも高く評価しました。前もって感謝します。

4

1 に答える 1

1

代わりに、単純な css マジックを使用してこの問題に取り組むことになるでしょう。

実際に body.style.cursor に javascript で値を割り当てる代わりに、正しいカーソルを表示する html タグのクラスを切り替えます。

CSS:

html
{
    cursor: default;
}

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

Javascript:

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

jsfiddle の作業: http://jsfiddle.net/BV3kn/2/

于 2013-02-06T19:40:30.327 に答える