HTML5 拖动文本遮罩和记录拖动
对于一个新的个人项目，我有一些很酷的想法，更多的是为了真正更新我的技能，但需要朝着正确的方向推动。对我来说解释起来有点困难，所以请耐心等待。
用户基本上可以从左到右对一段文本的填充进行着色。他们可以通过从左向右拖动来做到这一点。为了实现这一目标，我想到了 [HTML5 的文本/图像掩码][1]。然后，用户基本上从左向右拖动文本蒙版，它就会显示为他们在文本片段中“着色”的样子。
现在这是困难的部分；我想记录这个拖动并允许用户重播它是如何被用户“着色”的。那么在文本的不同位置有多快/慢。
如果我的解释不清楚，请告诉我，否则我很想听听您的建议/提示。
再次感谢！
I have something cool in mind for a new personal project, more to update my skills really, but need a push in the right direction. It's a bit difficult for me to explain so bear with me.
Users can basically color the fill of a piece of text from left to right. They can do so, by dragging from the left to right. To achieve this I was thinking of [HTML5's text/image mask][1]. Users would then basically drag the text mask from left to right, and it would appear as they "colored" in the piece of text..
Now here is the difficult part; I want to record this drag and to allow users to replay how it was "colored" in by the user. So how fast/slow at different positions of the text.
Please let me know if my explanation unclear, otherwise I'd love to hear your suggestion/hint.
Thanks again!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
似乎没有人走过这条路，文本的填充是通过拖动实现动画的。我得到的最接近的是： http://jsbin.com/ubaxi/ 填充的动画画布标签。对于我的情况来说不是很有用，但仍然值得一提。
也很有趣，也许是可行的方法：在画布对象上使用 jQuery animate
Seems like no one have been on this road, where the fill of a text is animated through a drag. The closest I got was this: http://jsbin.com/ubaxi/ An animation of the fill with the canvas tag. Not very useful for my case, but still worth mentioning.
Also interesting, and maybe the way to go: Using jQuery animate on canvas objects