Start with a blue box on a canvas.

wtaysom · Feb 25, 2012 · b4e9708 · b4e9708
commit b4e9708
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 0 deletions.
diff --git a/basics.html b/basics.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+	<title>Canvas Basics</title>
+</head>
+<body>
+	<canvas id="canvas" width="480" height="320" 
+		style="background-color: black;"></canvas>
+	<script src="basics.js"></script>
+</body>
+</html>
diff --git a/basics.js b/basics.js
@@ -0,0 +1,5 @@
+var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'blue';
+ctx.fillRect(40, 60, 150, 100);
diff --git a/notes.txt b/notes.txt
@@ -0,0 +1,2 @@
+Validate HTML <http://validator.w3.org/>.
+Dive into HTML5 canvas <http://diveintohtml5.info/canvas.html>.