mouseevent - RaphaelJS: mouseup and mousedown calling the same function? -
mouseevent - RaphaelJS: mouseup and mousedown calling the same function? -
i'm learning raphael , wonder how phone call same function both events, mousedown , mouse up, in order draw 2 dots every click.
you can test code here: jsfiddle
var w = window.innerwidth; var h = window.innerheight; var paper = raphael(0, 0, w, h); var canvas = paper.rect(0, 0, w, h,12); canvas.attr('fill', 'lightgrey'); canvas.mouseup(function (event, a, b) { // bounding rect of paper var bnds = event.target.getboundingclientrect(); var targetbox = this.getbbox(); // adjust mouse x/y var mx = event.clientx - bnds.left; var = event.clienty - bnds.top; // split x/y bounding w/h location %s , apply factor actual paper w/h var fx = mx/bnds.width * canvas.attrs.width + targetbox.x; var fy = my/bnds.height * canvas.attrs.height + targetbox.y; // cleanup output fx = number(fx).toprecision(3); fy = number(fy).toprecision(3); paper.circle(fx, fy, 1).attr("fill","black", "stroke-width",0); });
i'm pretty new raphaeljs, , did never need phone call function 2 mouse events javascript. so, i'm confused. help appreciated.
you can create new function, takes in event parameter, this...
canvas.mouseup( eventdraw ); canvas.mousedown( eventdraw ); function eventdraw( event ) { //... stuff };
jsfiddle
mouseevent raphael mousedown mouseup
Comments
Post a Comment