刮刮乐jquery插件：wScratchPad
完整项目资源下载：点击打开链接
运用wScratchPad插件非常快弄出刮刮乐的效果，代码例如以下：
<!DOCTYPE html>
<html>
<head>
<meta CHARSET="UTF-8">
<title>刮刮乐</title>
<script type="text/javascript" src="./inc/jquery.1.8.2.min.js"></script>
<script type="text/javascript" src="./wScratchPad.js"></script>
</head>
<div id="scratchpad" style="display:inline-block; position:relative;"></div>
<script type="text/javascript">
$("#scratchpad").wScratchPad({
'150',height:'40',color : "#a9a9a7",
scratchMove: function(e, percent)
{
if(percent > 70)
this.clear();
},
});
</script>
</body>
</html>但是后面用到项目时，发如今三星note3里面根本刮不了，网上搜问题，折腾了好久，改写例如以下代码：
<!DOCTYPE html>
<html>
<head>
<meta CHARSET="UTF-8">
<title>刮刮乐</title>
<script type="text/javascript" src="./inc/jquery.1.8.2.min.js"></script>
<script type="text/javascript" src="./wScratchPad.js"></script>
</head>
<div id="scratchpad" style="display:inline-block; position:relative;"></div>
<script type="text/javascript">
var useragent = window.navigator.userAgent.toLowerCase();
$("#scratchpad").wScratchPad({
'150',height:'40',color : "#a9a9a7",
scratchMove: function(e, percent)
{
if (useragent.indexOf("android 4") > 0)
{
$("#scratchpad").css("color", "rgb(50,50,50)");
if ($("#scratchpad").css("color").indexOf("51") > 0)
{
$("#scratchpad").css("color", "rgb(50,50,50)");
}
else if($("#scratchpad").css("color").indexOf("50") > 0)
{
$("#scratchpad").css("color", "rgb(51,51,51)");
}
}
if(percent > 70)
this.clear();
},
});
</script>
</body>
</html>完整项目资源下载：点击打开链接