鼠標點擊我的畫布上，鼠標懸停在畫布的一部分，鼠標移出畫布

我試圖連接鼠標懸停和鼠標移開事件畫布：鼠標點擊我的畫布上，鼠標懸停在畫布的一部分，鼠標移出畫布

默認畫布功能drawcircle的畫布。

如果用戶超出畫布，應將其更改爲drawEllipse的畫布，並且當他忽略時，應將其更改爲drawCircle。

此外，我想在用戶按下小亮藍圈（提醒消息）時在屏幕上打印消息。

我讀到，我必須定義：mouseup和mousedown爲鼠標和鼠標，但我真的不知道如何。

也許是這樣的：

getPressedCanvasPixel('canvas'); 

function getPressedCanvasPixel(canvasElement) { 
    canvas = document.getElementById(canvasElement); 
    canvas.addEventListener("mousedown", alertPressedPixel, false); 
} 

function alertPressedPixel(event) { 
    canvas_x = event.pageX; 
    canvas_y = event.pageY; 
    alert(canvas_x + ' , ' + canvas_y); 
}

任何幫助表示讚賞！

來源

2013-12-13 Alon Shmiel

使用jQuery可以嗎？如果是這樣，嘗試這樣的事情：

$('#canvas').on('mouseenter', function() { 
    console.log('enter'); // do your actions 
}) 
.on('mouseleave', function() { 
    console.log('exit'); // do your actions 
});

對於小圓圈，您需要保存其coorditates和處理鼠標點擊事件，你真正做到這一點，所以才加，如果他們接近的座標檢查你的圈。

來源

2013-12-13 06:23:37 Tony

非常感謝。我嘗試了你在jQuery中的建議，但我得到： http://jsfiddle.net/alonshmiel/c4upM/12/ 關於小圓的座標，我該如何做這個檢查？我需要獲得圓的所有座標。你能告訴我嗎？然後我將它插入到一個n數組中，然後我會知道如何檢查。謝謝！ –

@AlonShmiel當你隱藏觸發的'mouseleave'元素時，爲什麼你需要2個畫布？用一個畫布試試我的版本：http://jsfiddle.net/c4upM/14/ – Tony

你是對的！謝謝！ –

鼠標點擊我的畫布上，鼠標懸停在畫布的一部分，鼠標移出畫布

回答

相關問題