<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mobile-Web-App: HTML5 Canvas</title>
<script type="text/javascript">
var canvas;
var context;
function loadcanvas(){
canvas = document.getElementById("mycanvas");
context = canvas.getContext("2d");
}
function enter() {
var userenter = document.getElementById("textin").value;
context.fillText(userenter, 50, 50);
}
</script>
</head>
<body onload="loadcanvas();">
<h1>Mobile-Web-App: HTML5 canvas - Using JavaScript update canvas Text</h1>
<canvas id="mycanvas" style="border: 5px solid;" width="400" height="100">
Sorry! Your browser doesn't support Canvas.
</canvas>
<form>
<input id="textin" type="text" />
<input type="button" value="Enter" onClick="enter()" />
</form>
</body>
</html>
No comments:
Post a Comment