因为公司要做一个项目活动在微信中要有这一样款游戏活动了,但自己不会写于是网上找到了一个作者写的方案下面我整理了一下可以用同时也分享给大家。
本来是不想写这篇博文的,但又怕网友被坑,我还是写一下。
下载 jquery扩展wScratchPad.js, 原站的页面打不开,我这里提供一个下载地址 http://www.phprm.com
然后(冷静),一些没节操的博主,直接转别人的文章,验证的过程都省了,应该坑了不是小白。我这里修正一下
在这个扩展里面,怎么才能过去用户的刮开的面积
$("#wScratchPad3").wScratchPad({ cursor:'', //设置鼠标的样式 color:'gray' , //设置覆盖物的颜色,跟image2功能相斥 width:"300", height:"100", image: "" //顶部的图片 // 更多配置相关的选项请看源码 scratchUp : function (e, percent) { if (percent > 60) { alert("sss"); } } });
从上面的代码,看的出来,这个跟网上所谓的教程不一样,这里获取刮开的范围用到函数不是
scratchMove()
而是
scratchUp()
为嘛?看源码
scratchFunc: function(e, $this, event) { e.pageX = Math.floor(e.pageX - $this.canvas_offset.left); e.pageY = Math.floor(e.pageY - $this.canvas_offset.top); $this['scratch' + event](e, $this); if(this.settings.realtimePercent || event == "Up") { if($this.settings['scratch' + event]) $this.settings['scratch' + event].apply($this, [e, $this.scratchPercentage($this)]); } }
这里这个获取函数绑定的UP 而不是move
注意这里的wScratchPad是1.4.4最新版。
声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
4 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
4 周前By尊渡假赌尊渡假赌尊渡假赌
刺客信条阴影:贝壳谜语解决方案
2 周前ByDDD
R.E.P.O.如果您听不到任何人,如何修复音频
4 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它们
4 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

Dreamweaver Mac版
视觉化网页开发工具

EditPlus 中文破解版
体积小,语法高亮,不支持代码提示功能

Atom编辑器mac版下载
最流行的的开源编辑器

VSCode Windows 64位 下载
微软推出的免费、功能强大的一款IDE编辑器

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)