原生JavaScript HTML5Canvas手机刮刮乐效果

原生 JS 写的刮刮乐效果，用起来还挺顺手的，主要靠 HTML5 的来搞定刮涂层的那一块。没有用任何框架，逻辑也不复杂，适合想研究底层原理或者要兼容老设备的朋友玩一玩。

canvas 的刮涂逻辑比较清晰，就是监听touchmove事件，配合globalCompositeOperation = 'destination-out'做出刮除效果，手指一划就能看到底下的奖品图，响应也快。

移动端适配也考虑到了，布局比较轻，放在 H5 活动页、抽奖弹窗里都挺合适。你可以直接丢到index.html里跑，不用额外装啥依赖。

另外还有不少类似的资源，像html5 实现刮刮乐和canvas 绘制刮刮乐特效，有的还加了 jQuery、动画、音效，功能更花，适合搞点炫的。

如果你只是想找个简单好用的模板快速上线，这个原生 JS 版本就挺不错。代码少、注释多，改起来也方便，换个背景图就能直接上。