同学帮帮 h5 刮刮卡组件:Txbb.Scratch
2016-03-16 14:37
537 查看
同学帮帮 h5 刮刮卡组件,简洁、无依赖,支持 globals 和 amd 两种调用方式。
暂时只能用在移动端
fg(type: String): canvas 元素的颜色,即刮刮卡的颜色
middle(type: String): 刮完奖之后显示的元素,可以是 html 也可以是纯字符串
size(type: Number): 默认 20, 刮一下的半径
onEnd(type: Function): 刮完奖的回调函数
项目主页:http://www.open-open.com/lib/view/home/1442817103123
暂时只能用在移动端
使用方法
<div id="J-Scratch"></div>
var scratchInstance = Txbb.Scratch.attach(element, options);
element
需要初始化的 容器 元素,canvas 元素会被添加进去。var scratchInstance = Txbb.Scratch.attach(document.querySelector('#J-Scratch'), options);
options
bg(type: String): canvas 所在容器的背景颜色fg(type: String): canvas 元素的颜色,即刮刮卡的颜色
middle(type: String): 刮完奖之后显示的元素,可以是 html 也可以是纯字符串
size(type: Number): 默认 20, 刮一下的半径
onEnd(type: Function): 刮完奖的回调函数
实例方法
reset:scratchInstance.reset(options)重置刮刮卡,重置方法传入options可以改变实例化时的options项目主页:http://www.open-open.com/lib/view/home/1442817103123
相关文章推荐
- 同学帮帮移动 H5 弹出层类组件:txbb-pop
- 2016.3.16__HTML5新特性__第八天
- Html5之基础-1 WEB基础知识
- Html5_canvas_01
- Using HTML5 audio and video
- 使用HTML5 Web存储的localStorage和sessionStorage方式
- ace admin java 整合 开发 后台框架,aceadmin_HTML5
- [html5]记一些html5的东西
- h5
- HTML5骨骼动画Demo
- HTML5进阶(三)HBuilder实现软件自动升级(优化篇)
- HTML5进阶(三)HBuilder实现软件自动升级(优化篇)
- H5实现屏幕手势解锁
- 用HTML5的Audio标签做一个歌词同步的效果
- 利用 mui+html5plus+native.js开发
- HTML5 表单验证
- 语义化标签,和类名说再见
- html5和css篇有关浮动以及如何清除浮动
- html5 视频播放
- HTML5 1.11 figure/figcaptio