懒人之家--可能是JS网页特效代码收集最全的懒站!
更多

手机端刮奖效果jquery.eraser.js插件

作者/代码整理:  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载) 发布日期:2017-04-11
一款采用jquery.eraser.js插件写的手机端刮奖特效代码。


js代码

<script type="text/javascript" src="js/jquery.eraser.js" ></script>
<script>
	$(window).load(function  () { //这个适用手机端,等图片加载完再显示,因为有可能会出现第一次加载图片没有加载完就不会出现canvas
		$('#redux').eraser( {
			size: 20,   //设置橡皮擦大小
			completeRatio: .6, //设置擦除面积比例
			completeFunction: showResetButton   //大于擦除面积比例触发函数
		});
		function showResetButton(){
			$(".main_box .show,.main_box .mask").fadeIn(300)
		}
		$(".main_box .mask,.main_box .show .close,.main_box .show .btn").click(function  () {
			$(".main_box .show,.main_box .mask").fadeOut(300)
		})
	})
</script>