<!DOCTYPE HTML> <html> <head> <script type="text/javascript"> var prex,prey; var flag=0; function start(t,e) { t.style.cursor="crosshair"; prex=e.clientX; prey=e.clientY; flag=1; } function stop() { flag=0; } function draw(t,e) { t.style.cursor="crosshair"; document.getElementById("x").innerHTML=e.clientX; document.getElementById("y").innerHTML=e.clientY; if (flag==1) { var c=document.getElementById("myCan").getContext("2d"); c.moveTo(prex,prey); c.lineTo(e.clientX,e.clientY); c.stroke(); prex=e.clientX; prey=e.clientY; } } function getOut() { flag=0; } </script> </head> <body> <canvas id="myCan" style="border:1px solid #000000" width="256" height="256" onmousemove="draw(this,event)" onmouseout="getOut()" onmousedown="start(this,event)" onmouseup="stop()"> </canvas> <p id="x"></p> <p id="y"></p> </body> </html>
时间: 2024-10-29 03:29:32