Данный код вставляете в блокнот и сохраняете как html-файл. После чего открываете браузером. Предупреждение: в ИЕ не работает. Ну нет в ИЕ такого тега как <canvas>!
<script type="text/javascript">
var point1 = {x:0, y:0};
var point2 = {x:0, y:0};
function draw(event) {
var canvas = window.document.getElementById("canvas")
if(canvas.getContext) {
var ctx = canvas.getContext("2d");
} else return;
ctx.strokeStyle = "rgba(0,0,0)";
ctx.moveTo(point1.x,point1.y);
mousePageXY(event,point2);
ctx.lineTo(point2.x,point2.y);
ctx.stroke();
}
function mousePageXY(e,point)
{
var x = 0, y = 0;
if (!e) e = window.event;
if (e.pageX || e.pageY)
{
x = e.pageX;
y = e.pageY;
}
else if (e.clientX || e.clientY)
{
x = e.clientX
y = e.clientY
}
point.x=x;
point.y=y;
}
</script>
<canvas id="canvas" width="500" height="500" style="border:4px double black" onmousedown="mousePageXY(event,point1)" onmouseup="draw(event)">Работает в Опере и FireFox. В IE не работает. Пожалуста, включите Яваскрипт. </canvas>
Конечно, Пейнтом это названо с большой натяжкой. Но это так, на скорую руку слеплено.
