<!doctype html> <html> <head> <meta charset="utf-8"> <title>Embed Image</title> <link rel="stylesheet" href="../include/style.css"> <style> #picture { display: none; } </style> </head> <body> <header> Example from <a href="http://amzn.com/1430236655?tag=html5anim-20"><em>Foundation HTML5 Animation with JavaScript</em></a> </header> <canvas id="canvas" width="400" height="400"></canvas> <img id="picture" src="./assets/picture.jpg"> <script> window.onload = function () { var canvas = document.getElementById('canvas'), context = canvas.getContext('2d'), image = document.getElementById('picture'); context.drawImage(image, 0, 0); }; </script> </body> </html>