jQuery实现刮奖插件ScratchMod特效
稿源: 互联网
刮奖用组件,使用了html5的画布(canvas) 在不支持画布的浏览器中自动使用div的形式。
使用方法
依赖jquery
组件需要一个容器元素,组件将在容器中生成刮奖元素,自动兼容不支持画布的浏览器,调用时返刮奖元素
<div id="scratch_mod_container" ></div>
var canvas = ScratchMod({ 'container': , //目标容器 'bgImgSrc': , //背景图 'imgSrc': , //蒙版图 'penImgSrc': , //擦笔图 'color': , //蒙版颜色(有imgSrc的情况下该属性无效) 'width': , //宽度 'height': , //高度 'eraseRadius': , //擦除笔的半径(有penImgSrc的情况下无效) 'sampleStep': , //获取擦除百分百时的精度(数字越大精度越小) 'sampleCD': , //获取擦除百分百的时间间隔 'sampleCallback': , //获取擦除百分百的回调函数(返回true后不再回调),回调的第一个入参为擦除百分百 'startCallback': //开始刮的回调(只回调一次,回调的第一个入参为生成的元素类型 canvas或div) })
相关插件