标签：style blog color io os ar java sp div
<html> <head> </head> <body> <div> <canvas id="_canvas" width = "1900" height="1000" ></canvas> </div> <script type="text/javascript"> var ctx = document.getElementById("_canvas").getContext("2d"); var lastPosition = null; var c = "#ADFF2F"; var w = 5 ; var isDown = false; function d( x , y ){ ctx.beginPath(); ctx.strokeStyle = c ; ctx.fillStyle = c ; ctx.arc(x , y , w /2 , 0 , Math.PI * 2 ); ctx.fill(); ctx.beginPath(); ctx.lineWidth = w ; ctx.lineCap = ctx.lineJoin = "round"; if( lastPosition ){ ctx.moveTo( lastPosition.x , lastPosition.y); ctx.lineTo( x , y ); ctx.stroke(); } lastPosition = {"x" : x , "y" : y }; }; function onMousDown( event ){ event.preventDefault(); var x = event.clientX; var y = event.clientY; isDown = true; d( x , y ); }; function onMouseMove( event ){ event.preventDefault(); if( isDown ){ var x =event.clientX , y = event.clientY; d( x, y ); } }; function onMouseUp( event ){ event.preventDefault(); if(isDown){ isDown = false; lastPosition = null; } }; var canvas = document.getElementById("_canvas"); canvas.addEventListener("mousedown",onMousDown,false); canvas.addEventListener("mousemove",onMouseMove,false); canvas.addEventListener("mouseup",onMouseUp,false); </script> </body> </html>
标签：style blog color io os ar java sp div
原文地址：http://www.cnblogs.com/andy1987/p/4023384.html
