Time for action – making our code compatible with IE

In this example we will recreate our flag example so that it works as intended in IE.

  1. Resave the canvas.html page as canvas-explorer.html and add a reference to the explorercanvas library in the <head> of the page:
    <!--[if IE]>
      <script src="js/excanvas.compiled.js"></script>
    <![endif]-->
  2. Now change the script at the bottom so that it appears like this (new/changed code is shown in bold):
    var canvas = document.getElementById("c"), draw = function(context) { context.fillStyle = "#039"; context.fillRect(50, 50, 400, 200); context.beginPath(); context.strokeStyle = "#fff"; context.lineWidth = 50; context.moveTo(250, 50); context.lineTo(250, 250); context.moveTo(50, 150); context.lineTo(450, 150); context.moveTo(50, ...

Get jQuery 1.4 Animation Techniques Beginner's Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.