캔버스를 클릭하고 마우스를 드래그하면 커서가 텍스트 선택 커서로 바뀝니다. 이 문제를 어떻게 방지 할 수 있습니까?

Question

다음은 바이올린입니다. http://jsfiddle.net/MZ9Xm/

참고 : 다음은 Chrome 22.0.1221.1에서는 발생하지만 Firefox 14.0.1에서는 발생하지 않습니다. [Ubuntu Linux]

마우스를 상단 캔버스로 이동하고 마우스 버튼을 누르고 있습니다. 마우스를 드래그하면 커서가 텍스트 선택 마우스 커서 (I-bar)로 바뀝니다. 페이지에 다른 요소가 없으면 이런 일이 발생하지 않습니다.

사용자 선택을 none으로 설정하는 데 혼란스러워했지만 운이 없었습니다.

Answer 1

기본 동작을 방지하기 위해 mousedown 이벤트를 캔버스에 바인딩 할 수 있습니다. 같은

뭔가 : 당신은 당신이하고있는 일에 어떤 부작용이 있는지 확인하기 위해 테스트해야합니다 http://jsfiddle.net/MZ9Xm/1/

: 여기

// with jQuery 
$("#canvasId").mousedown(function(event){ 
    event.preventDefault(); 
}); 

// without jQuery 
document.getElementById("canvasId").onmousedown = function(event){ 
    event.preventDefault(); 
}; 

업데이트 된 바이올린입니다.

Answer 2

CSS cursor property을 사용해 보셨습니까?

canvas { 
    cursor: pointer; 
} 

기본 커서가 표시되어야합니다.

Answer 3

이 시도 :

var canvasEls = document.getElementsByTagName('canvas'), 
    preventHl = function() { return false; }, 
    i = 0; 

while (i < canvasEls.length) { 
    canvasEls[i].onmousedown = preventHl; 
    i += 1; 
} 

등의 발생 강조 기본적 작업을 방지 할 수 false를 반환.