HTML5での画像表示について
HTML５を勉強しはじめたばかりの者です。
http://nigohiroki.hatenablog.com/entry/2013/01/04/025502
ここのサイトみながらラインと四角を表示することはできたのですが、
画像を表示することができません。
<!DOCTYPE HTML>
<html lang="ja-JP">
<head>
<meta charset="UTF-8">
<title>canvasApp</title>
</head>
<body onload="init()">
<canvas id="first" width="200" height="200"></canvas>
<script type="text/javascript">
var canvas = document.getElementById('first');
var ctx = canvas.getContext('2d');
function init(){
var img = new Image();
img.src = "01.jpg";
ctx.drawImage(img, 100, 100, 200, 200);
}
</script>
</body>
</html>
どこがおかしいのかさっぱりわかりません。
試しに</body>の前に<img src="01.jpg">と入れるとなぜか表示できるのですが、
外すと表示できなくなります。
よろしくお願いします。
