HTML5 Canvas 合成(来源)
我正在尝试使用画布在 HTML5 中重新创建页面翻转类型动画。该动画基于此页面的想法。但这并不重要。我遇到的问题是,使用“源输入”复合操作并没有给我预期的结果,并且希望澄清原因。我认为它只适用于 chrome,不适用于 FF 3.6。
黑色矩形应该充当翻页的“掩模”。我只想看到与遮罩重叠的区域翻页。问题是绘制了整个黑色矩形,而不仅仅是它们重叠的区域。
我知道 HTML5 还没有真正被使用,我只是为了我的个人网站和好奇心而进行试验。任何想法将不胜感激。
I am trying to recreate a page flipping type animation in HTML5 using canvas. The animation is based on ideas from this page. But that's not really important. The problem I am having is that using the 'source-in' composite operation is not giving me the results I expect and would like clarification as to why. I think it only works on chrome, not working on FF 3.6.
The black rectangle is supposed to act as a 'mask' for the page being turned over. All I want to see is the turning page in the areas where it overlaps the mask. The problem is the entire black rectangle is drawn, not just the area where they overlap.
I know HTML5 isn't really being used yet, I'm just experimenting for my personal site and curiosity. Any ideas would be greatly appreciated.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
Canvas 合成支持已损坏,并且在某些浏览器中可能仍然不完整。
在此处比较图像
使用浏览器中的实际渲染来查看哪些浏览器适用现在。
Canvas Compositing support was broken and might still be incomplete in some browsers.
Compare the images here
with the actual rendering in your browser to see what works in which browser right now.