如果你想使用 HTML5 canvas 来绘制形状、文本和曲线，并且还想附加传统的 DOM 事件，如 onClick 或拖放功能，可以使用 Crossbar 框架 Raphael 来进行拖放操作放下或触摸事件。
此技术针对旧版本的 IE 使用 SVG 和 XML。使用 HTML 进行拖拽如下所示。
示例
Raphaël · Drag-n-drop window.onload = function () { var R = Raphael(0, 0, "100%", "100%"), r = R.circle(100, 100, 50).attr({fill: "hsb(0, 1, 1)", stroke: "none", opacity: .5}), g = R.circle(210, 100, 50).attr({fill: "hsb(.3, 1, 1)", stroke: "none", opacity: .5}), b = R.circle(320, 100, 50).attr({fill: "hsb(.6, 1, 1)", stroke: "none", opacity: .5}), p = R.circle(430, 100, 50).attr({fill: "hsb(.8, 1, 1)", stroke: "none", opacity: .5}); var start = function () { this.ox = this.attr("cx"); this.oy = this.attr("cy"); this.animate({r: 70, opacity: .25}, 500, ">"); }, move = function (dx, dy) { this.attr({cx: this.ox + dx, cy: this.oy + dy}); }, up = function () { this.animate({r: 50, opacity: .5}, 500, ">"); }; R.set(r, g, b, p).drag(move, start, up); };Demo of Raphaël— JavaScript Vector Library
以上就是”HTML5 Canvas和JS库中的选择/拖放功能?”的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1551532.html
微信扫一扫 
支付宝扫一扫 
