本来是不想写这篇博文的,但又怕网友被坑,我还是写一下。
下载 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最新版。
