Overview

In this blog, I am showing how you can easily provide animation in the images using an HTML5 canvas tag.
You only have to call canvas element in your snippet using this tag:
<canvas id="myCanvas"> </canvas>
Code
  1. <html>
  2. <head>
  3. <title>Canvas | Image</title>
  4. <style>
  5. {
  6. margin: 0px;
  7. padding: 0px;
  8. }
  9. </style>
  10. </head>
  11. <body>
  12. <canvas id="myCanavs" width="320px" height="280px"></canvas>
  13. <script>
  14. var canvas = document.getElementById('mycanvas');
  15. var context = canvas = canvas.getContext('2d');
  16. var imageobj = new Image();
  17. imageobj.onload = function () {
  18. context.drawimage(imageobj, 69, 50);
  19. };
  20. imageobj.source = "12.jpg";
  21. </script>
  22. </body>
  23. </html>