Skip to content

Instantly share code, notes, and snippets.

@tai2
Last active January 2, 2016 04:39
Show Gist options
  • Select an option

  • Save tai2/8251667 to your computer and use it in GitHub Desktop.

Select an option

Save tai2/8251667 to your computer and use it in GitHub Desktop.
Canvas Test
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF=8">
<title>My First Canvas Application</title>
<script type="text/javascript">
window.addEventListener(
"load",
function(event) {
function canvasSupport() {
return !!document.createElement('canvas').getContext;
}
function drawScreen(context) {
context.fillStyle = "#ffffaa";
context.fillRect(0, 0, 500, 300);
context.fillStyle = "#000000";
context.font = "20px _sans";
context.textBaseline = "top";
context.fillText("Hello World!", 195, 80);
context.strokeStyle = "#000000";
context.strokeRect(5, 5, 490, 290);
}
if (canvasSupport()) {
var canvas = document.getElementById("canvasOne");
drawScreen(canvas.getContext("2d"));
}
}, false);
</script>
</head>
<body>
<div style="position: absolute; top: 50px; left:50px;">
<canvas id="canvasOne" width="500" height="300">
Your browser does not support HTML5 Canvas.
</canvas>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment