html代码:
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <style>
7 * {
8 margin: 0;
9 padding: 0;
10 }
11
12 #myCanvas {
13 background: #abcdef;
14 }
15 </style>
16 </head>
17 <body>
18 <canvas id="myCanvas" width="550px" height="400px"></canvas>
19 <script src="main.js"></script>
20 </body>
21 </html>
js代码：
1 (function () {
2
3 var c = document.getElementById("myCanvas");
4 var con = c.getContext("2d");
5
6 c.onmousedown = function (e) {
7 c.onmousemove = function (e) {
8 con.beginPath();
9 con.arc(e.pageX, e.pageY, 5, 0, 2 * Math.PI);
10 con.fillStyle = "white";
11 con.fill();
12 con.closePath();
13 };
14 c.onmouseup = function (e) {
15 c.onmousemove = "";
16 }
17
18 }
19
20 })();
时间： 2024-12-16 07:50:58