example:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>i can code! for Web::HTML5 Canvas</title>
<script type="text/javascript">
var mycontext;
function canvasloader(){
var mycanvas = document.getElementById("canvas");
mycontext = mycanvas.getContext("2d");
var formElement = document.getElementById("textin");
formElement.addEventListener("keyup", textinChanged, false);
}
function textinChanged(e){
var target = e.target;
text = target.value;
mycontext.fillStyle = "#000000";
mycontext.fillText(text, 50, 50);
}
</script>
</head>
<body onload="canvasloader();">
<h1>i can code! for Web::HTML5 Canvas</h1>
http://icancode-4-web.blogspot.com/<br/>
<canvas id="canvas" style="border: 1px solid;" width="360" height="100">
Sorry! Your browser doesn't support Canvas.
</canvas>
<form>
<input id="textin" />
</form>
</body>
</html>
No comments:
Post a Comment