要用到HTML5的画布Canvas。
什么是Canvas呢？先来给大家讲解下：

HTML5 <canvas> 元素用于图形的绘制，通过脚本 (常日是JavaScript)来完成。

<canvas> 标签只是图形容器，您必须利用脚本来绘制图形。

html5判断刮刮卡进度HTML5的canvas画布实现刮刮卡道理 Java

创建画布的方法：

<canvas id=\"大众myCanvas\"大众 width=\"大众200\公众 height=\"大众100\"大众></canvas>

把稳: 标签常日须要指定一个id属性 (脚本中常常引用), width 和 height 属性定义的画布的大小.

你可以在HTML页面中利用多个 <canvas> 元素。
可以给你设定的canvas添加各种样式！

知道画布的方法后，下面就来办理刮刮卡的效果：

效果图：

创建一个300X200的canvas画布

javascript代码 :

鼠标操作事宜：