CODEWITHSUNDEEP
javascriptcanvasinternet-explorer-9
Pacerier
Pacerier

Reputation: 89793

Why does my IE9 does not support canvas?

DiveIntoHTML5 Canvas claims that IE9 supports canvas.

However, when I tried doing canvas on IE9, it doesn't work:

Object doesn't support property or method 'getContext'

I'm using IE9.0.8112.16421:

enter image description here

This is the code:

<html>
<head>

</head>
<body style="background:black;margin:0;padding:0;">
<canvas id="canvas" style="background:white;width:100%;height:100%;">noob</canvas>
<script>
var img=new Image();
img.onload=function(){
  var c=document.getElementById('canvas');
  var ctx = c.getContext('2d');
  var left,top;
  left=top=0;
  ctx.drawImage(img,left,top,20,20);
  var f=function(){
    left+=1;
    top+=1;
    c.width=c.width;
    ctx.drawImage(img,left,top,20,20);
  };
  setInterval(f,20);
};
img.src="http://a.wearehugh.com/dih5/aoc-h.png";
</script>
</body>
</html>

Upvotes: 25

Views: 37000

Answers (6)

TzeMan
TzeMan

Reputation: 77

guys!

Check out Explorer Canvas on Google Code: https://code.google.com/p/explorercanvas/

Hope this helps!

Tze

Upvotes: 0

Karen
Karen

Reputation: 11

when use IE10 in compatibility view please check IE compatibility version. Enter F12 (open developer Tools) and check appropriate IE (for example IE9) version you need test and browser will job right under this version.

Upvotes: 1

Ray
Ray

Reputation: 11

Running IE 9.0.8112.16421. Canvas element won't work initially but if I hit F12 to bring up devtools, then refresh, it starts working. Normal refresh w/o devtools window open won't work. May be a JS init problem since the canvas was working before I moved the canvas drawing code into its own .js file. Works fine in Chrome/Firefox/Safari.

Upvotes: 1

Mike Strother
Mike Strother

Reputation: 331

If IE9 is running in compatibility mode, the canvas tag will not be recognized, even if you are using the HTML5 DOCTYPE tag. At least that has been my experience.

Check to see if IE9 is running in compatibility mode, which can be the case if the site is on an intranet.

Upvotes: 14

Tadiotto
Tadiotto

Reputation: 69

<!DOCTYPE html> must be the first thing on your page. I had a script before the tag and it kept giving me the same error. This only happens in IE9, Chrome and Firefox work even with a script before the doctype tag.

Upvotes: 6

Jeff
Jeff

Reputation: 12418

Two things:

The <canvas> tag should having a corresponding closing tag </canvas>. While some browsers will let you get by with just an opening tag, others (such as Firefox, and perhaps IE) won't.

In addition, IE9 requires you to declare an HTML5 doctype to use the canvas tag. You can do this by placing <!DOCTYPE html> at the top of your code.

Upvotes: 52

Related Questions