微信大学-刮刮乐制作

先看效果：

这个是商用案例，有需求的朋友可以百度：南京spark    联系我们

本次我们使用剥离后的纯粹的功能的代码讲解，先看效果

1、引入jquery文件

<script type="text/javascript" src="jquery.1.9.1.min.js"></script>

2、引入 插件

<script type="text/javascript" src="wScratchPad.js"></script>

3、jQuery代码

<script type="text/javascript">
			//wScratchPad2  就是要放效果的DIV 的ID
            $("#wScratchPad2").wScratchPad({
                color: 'grey',//覆盖的刮刮层的颜色
                image: 'images/slide1.jpg', //刮奖结果图片
                cursor: 'images/mario.png'  //刮的笔刷图片
            });
        </script>

4、HTML代码其实就一句

<div id="wScratchPad2" style="display:inline-block; position:relative; border:solid black 1px;"></div>

最后完整代码下载地址： demo