时间：2015-02-09 来源： HTML5canvas做画板画图可以做电子白板 【综合】
HTML5 canvas 做画板画图 可以做电子白板
<html>
<head>
<meta charset="utf-8">
<title>HTML5 canvas 做画板画图 可以做电子白板</title>
<style type="text/css">
<!--
#container { position: relative;}
#imageView { border: 1px solid #000; }
--></style>
</head>
<body>
<div id="container">
<canvas id="imageView" width="800" height="500">
</canvas>
</div>
<script type="text/javascript">
var canvas;
var context;
var tool;
/**
* called on window load.
*/
if(window.addEventListener){
window.addEventListener('load', ev_canvas, ev_canvas,ev._y);
tool.started = true;
};
/**
* This is called every time you move the mouse.
* Obviously,ev._y);
context.stroke();
}
};
/**
* This is called when you release the mouse button.
*/
this.mouseup = function (ev) {
if(tool.started){
tool.mousemove(ev);
tool.started = false;
}
};
}
/**
* general-purpose event handler.
* determines the mouse position relative to the canvas element.
*
* @param ev
*/
function ev_canvas(ev){
var x,y;
if(ev.offsetX || ev.offsetY == 0){
ev._x = ev.offsetX;
ev._y = ev.offsetY;
}
/**
* call the event handler of the tool.
*/
var func = tool[ev.type];
if (func) {
func(ev);
}
}
</script>
</body>
</html>
效果图：
作者：
相关文章
精彩导读
热门资讯
关注我们
