开发者

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:

Why does my IE9 does not support canvas?

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>


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.


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.


<!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.


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.


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.


guys!

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

Hope this helps!

Tze

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜