html鼠标点击 拖动,javascript – HTML5画布点击并拖动

我使用相同的代码来查找相对于特定元素的鼠标位置(在本例中为

HTML5画布).这适用于鼠标按下,但鼠标按下时会中断.如何让它在鼠标上运行？

This is page one; here we will play with HTML5

This link takes you back to home

id="myCanvas" width="1600" height="800" style="border:1px solid #000000;">

var rect1x = rec1y;

var a = b;

function mouseDown()

{

a = document.getElementById("myCanvas").getBoundingClientRect().left;

b = document.getElementById("myCanvas").getBoundingClientRect().top;

rect1x = window.event.clientX - a;

rect1y = window.event.clientY - b;

}

function mouseUp()

{

var rect2x = window.event.clientX - a;

var rect2y = window.event.clientY - b;

var c=document.getElementById("myCanvas");

var ctx=c.getContext("2d");

ctx.fillStyle="#FF0000";

ctx.fillRect(rect1x,rect1y,rect2x,rect2y);

}

Draw!