canvas

刮刮卡:利用HTML5的画布Canvas的实现移动端刮刮卡效果

我们利用HTML5的画布canvas,结合其提供的API,在Canvas元素上绘制一个灰色蒙层,然后通过检测用户鼠标移到和手势来绘制一个透明的图形,这样就能看到Canvas背景下的真实图片,就达到刮刮卡效果。
HTML
我们只需要在页面中加入canvas标签元素,其他的就看javascript的了。注意canvas元素是HTML5才有的元素,运行在支持HTML5的现代浏览器上,特别是移动。

1.png - 大小: 40.87 KB - 尺寸: 966 x 542 - 点击打开新窗口浏览全图

DEMO:


http://www.jincon.com/download/guaguaka/

» 阅读全文

关键词: canvas , 刮刮卡