HTML5+Canvas实战之刮奖效果

项目描述

HTML5+Canvas实战之刮奖效果,实现网页上刮奖，可以用作验证码；

可以在移动设备上和PC端网页（浏览器要支持canvas）上运行

##使用说明

    var lottery = new Lottery(id, cover, coverType, width, height, drawPercentCallback);
    
    lottery.init(lottery,lotteryType);
    
    function drawPercentCallback(percent) {
        //some code here
    }

##构造方法参数解释

`id`:刮奖容器，必须

`cover`:涂层内容，可以为图片地址或颜色值，可空，默认为 #ccc

`coverType`:涂层类型，值为 image 或 color，可空，默认为 color

`width`:刮奖区域宽度，默认为300px，可空

`height`:刮奖区域高度，默认为100px，可空

`drawPercentCallback`:刮开的区域百分比，可空

##init方法解释

`lottery`:刮开后显示的内容，可以为图片地址或字符串，必须

`lotteryType`:刮开后显示的内容类型，值为 image 或 text，要跟`lottery`匹配，默认为 image

运行环境

html

项目技术(必填)

HTML5+Canvas+CSS

数据库文件

无

jar包文件

无

是否原创(转载必填原文地址)

原创

项目截图(必填)

运行截图(必填)