- 创建一个画布（Canvas）
- 一个画布在网页中是一个矩形框，通过 元素来绘制. 其主要效果考JS脚本实现。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Canvas-网页涂鸦板</title>
</head>
<body>
<center>
<canvas id="canvsElem" width="900" height="600" style="border: 1px solid rgb(0, 0, 0);">
</canvas>
</center>
<script type="text/javascript">
(function(){
var canvans = document.getElementById('canvsElem');
var context = canvans.getContext('2d');
canvans.width = 900;
canvans.height = 600;
canvans.style.border = "1px solid #000";
canvans.onmousedown = function(e) {
var x = e.clientX - canvans.getBoundingClientRect().left;
var y = e.clientY - canvans.getBoundingClientRect().top;
context.beginPath();
context.moveTo(x,y);
canvans.onmousemove = function(event) {
var x = event.clientX-
canvans.getBoundingClientRect().left;
var y = event.clientY- canvans.getBoundingClientRect().top;
context.lineTo(x,y);
context.stroke();
};
canvans.onmouseup = function(event){
canvans.onmousemove = null;
};
};
} ());
</script>
</body>
</html>
457
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
