html5画布手形光标问题

我正在玩HTML5和一些JavaScript来制作一个小画板。每当我用chrome点击画布时，光标变成文本光标。我试图把光标放在CSS中，但这似乎不起作用。这一定是一件容易的事情，但我看它并不能在任何地方找到它html5画布手形光标问题

2010-04-17 pfunc

那么，首先它的“光标：指针”不是“光标：手”...... – animuson 2010-04-17 20:46:24

使用pointer为你的光标属性，而不是像这样：

canvas { cursor: pointer; }

hand是IE /歌剧具体， you can see a full list of which cursors work in which browsers here。

来源

2010-04-17 20:46:40

特别是这个注释在所提到的链接中很有帮助http://www.quirksmode.org/css/cursor.html#note – 2010-04-17 20:56:23

我把它放进去，但仍然在做同样的事情。检查它在这里：http://p-func.com/html5_test/test2.html – pfunc 2010-04-17 21:30:40

@pfunc - 我无法直接调试您的页面，它有一些无效的属性，需要更正...''，他们不能像'

使用画布上的禁用文本选择。这像一个魅力。

var canvas = document.getElementById('canvas'); 
canvas.onselectstart = function() { return false; } // ie 
canvas.onmousedown = function() { return false; } // mozilla

干杯，克里斯

来源

2010-07-07 18:03:15 Kris

美丽！我一直在寻找一个解决方案，谁会梦见它如此简单？对于互联网的启发：“返回错误”方法也可以防止光标在Chrome中更改为i型光束。我知道阿特伍德不喜欢在他们的评论中口头表达感激之情，但无论如何谢谢你！ – Toji 2011-01-17 05:42:51

对于webkit浏览器，您还可以添加'body {-webkit-user-select：none; ''到你的CSS。 – Jacksonkr 2011-09-01 17:07:23

不错！这节省了我不少时间！ – BaronVonKaneHoffen 2012-02-26 16:38:17

而其他人是绝对的指你的怪异模式参考的一声，这不会解决你所遇到的问题，而且基本上你需要实现的变化克里斯的回答。

在我自己的实现，我发现，防止鼠标按下事件默认行为是被要求停止讨厌的文本选择光标一切：

function handleMouseDown(evt) { 
    evt.preventDefault(); 
    evt.stopPropagation(); 

    // you can change the cursor if you want 
    // just remember to handle the mouse up and put it back :) 
    evt.target.style.cursor = 'move'; 

    // rest of code goes here 
} 

document.addEventListener('mousedown', handleMouseDown, false);

希望有所帮助。

干杯，达蒙。

来源

2010-09-09 00:06:08

是的，这确实有帮助。谢谢！ – shino 2012-08-04 02:27:26

html5画布手形光标问题

回答

相关问题