当前位置:首页 > Canvas实现刮刮卡功能,canvas刮奖,canvas抽奖

Canvas实现刮刮卡功能,canvas刮奖,canvas抽奖

发布于 2018-06-08 阅读 519 次 Canvas Javascript HTML5
`预览:`[刮刮卡](https://www.w2le.com/demo/guagua.html "刮刮卡") 介绍:适用于事先确定好中奖结果的,中奖结果由后台设置,此代码只是负责展示一个效果。 `使用:` **1.引入card.js** ```html ``` **2.初始化代码** ```html
``` ```javascript var card = new Card({ id : 'card', backType : 'image', backImg: $('.J-canvas').data('url'), //奖品图 maskType: 'image', maskImg: '/demo/images/guagua-cover.png', //蒙层图 width: 200, height: 100, radius: h/5, callback: function(){ // winningCallback(); } }); card.init(); ``` 如果需要显示刮开百分比调用drawPercent。 详细可以自己看代码,自认为注释很详细。