JSFiddle - React, Tailwind, and code Playground
JavaScript
r= new Raphael(0,0,500,500);
function Button(ix,iy,ir)
{
var that = this;
that.a = r.circle(ix, iy, ir).attr({"fill":"red"})
// drag handler
that.start = function(x,y,event) {
that.a.ox = this.attr("cx");
that.a.oy = this.attr("cy");
that.a.animate({r: 20, opacity: .25}, 500, ">");
}
that.move = function(dx, dy) {
that.a.attr({cx: that.a.ox + dx, cy: that.a.oy + dy});
}
that.up = function () {
that.a.animate({r: 15, opacity: .5}, 500, ">");
};
that.a.drag(that.move,that.start,that.up);
return that;
}
var one = new Button(20,20,5);
var two = new Button(100,100,10);