Question

我正在开发一款浏览器游戏，我正在使用自定义游标。我正在为CSS中的整个页面设置自定义光标（出于某种原因，如果我将其设置为＆＃39; body有时会在某个区域更改为默认光标）

html {
  cursor: url("http://www.iwansfactory.com/tycoon/defaultcursor.png"), default;
}

我想使用javascript

覆盖上述CSS的url属性

例如，当用户移动地图时，我想使用此自定义光标：

http://www.iwansfactory.com/tycoon/movecursor.png

如何使用javascript更改此值？提前致谢！：）

Answer 1

document.documentElement.style.cursor = 'url("http://www.iwansfactory.com/tycoon/movecursor.png"), default';

Answer 2

你解释它的方式，你甚至不需要javascript？为什么不做一些像

这样的事情

.map:hover{ cursor : url('http://www.iwansfactory.com/tycoon/movecursor.png') }

Answer 3

你可以尝试这个，如果你需要js，否则按照上面的css ...

      <span onmouseover="changeCursor(this,'http://www.iwansfactory.com/tycoon/movecursor.png');" onmouseout="changeCursor(this,' url("http://www.iwansfactory.com/tycoon/defaultcursor.png"), default');"> Hello World </span>

        function changeCursor(el, cursor)
        {   

             el.style.cursor = cursor;
         }

Answer 4

如果您希望光标更改为move-cursor，则可以尝试使用事件MouseOver在鼠标悬停在地图上时更改其样式，并将事件MouseOut恢复为默认值。

Answer 5

您可以为每种游标类型添加css类，然后onmouseenter事件将您的游戏逻辑应用于选择要应用的css类。

使用javascript更改光标样式

5 个答案: