mousedown RaphaelJS의 이벤트가 작동하지 않습니다.

Question

RaphaelJS가 mousedown/mousemove/mouseup 이벤트에 반응하지 않지만 .click()으로 문제없이 작동합니다.

나는이 뜻을 보여주기 위해 http://jsfiddle.net/JMu7Z/2/을 만들었습니다.

JS 번호 :

var containerDivs = document.getElementsByClassName('container'); 
var overlayDiv = null; 
for(var k=0;k<containerDivs[0].childNodes.length;k++) 
{ 
    if (containerDivs[0].childNodes[k].className.indexOf("holder") !== -1) 
     overlayDiv = containerDivs[0].childNodes[k]; 
} 
var canvas = Raphael(overlayDiv,208,270); 
var bgr = canvas.rect(10,10, canvas.width-10, canvas.height-10).attr({fill: "0xFF0000", stroke: "none", opacity:"0.2"}); 

bgr.mousedown(function(e) { alert ("down"); }); //doesn't work 
bgr.click(function(e) { alert ("click"); }); // works 

HTML : 어떤 도움이 높게 평가되어

<div class="container" style="position: relative; left: 0; top: 0;"><img class="corePic nonselectable" style="position:relative; top: 0; left: 0;" src="http://upload.wikimedia.org/wikipedia/commons/thumb/5/56/Tesla3.jpg/220px-Tesla3.jpg" alt="2_3"><div class="holder nonselectable" style="position:absolute; top:0px; left:0px;" onselectstart="return false;"></div></div> 

.

Answer 1

보기 당신을 기준으로 제공 한 DEMO

//bgr.click(function(){this.attr({stroke:'orange',"stroke-width":5,opacity:0.5}); 
bgr.mousedown(function() 
{ 
    this.attr({stroke:'red',"stroke-width":5,opacity:0.5}); 
}); 
bgr.mouseup(function() 
{ 
    this.attr({stroke:'blue',"stroke-width":5,opacity:0.5}); 
}); 
//bgr.mousemove(function(){this.attr({stroke:'green',"stroke-width":5,opacity:0.5}); 

동시에 사용할 수없는 일부 수신기가 있습니다. 예를 들어

:

• click 및 mousedown 이벤트는 동일한 개체에 함께 사용할 수 없습니다. 왜? 마우스 단추를 누르 자마자 mosedown 이벤트가 트리거되기 때문에; click은 다릅니다. DEMO를 보면, 모든 것을 주석 처리하고 click의 주석을 삭제하십시오. 마우스 버튼을 길게 누르면 버튼을 놓을 때까지 아무런 반응이 없습니다. 그 이유는 두 이벤트가 같은 개체에있을 때 mousedown이 먼저 트리거되고 click을 인계하기 때문입니다.
• mouseup 및 mousemove도 이전과 유사하게 동작합니다. mousemove이 즉시 트리거되고 'mouseup'이벤트를 대신합니다. 따라서 두 이벤트가 구현 된 개체에 대해서만 mousemove 이벤트를 볼 수 있습니다.

---

플러스, mousemove 정말 짜증나입니다. 가지고있을 때 click, mousedown 또는 mouseup 이벤트가 발생하지 않습니다. 세 가지 경우 모두 마우스를 요소 위에 올리면 트리거되고 계속 머무르게됩니다.

조금 도움이 되었기를 바랍니다.