Почему мой IE9 не поддерживает холст?

DiveIntoHTML5 Canvas утверждает, что IE9 поддерживает холст.

Однако, когда я пытался сделать canvas на IE9, он не работает:

Объект не поддерживает свойство или метод 'getContext'

Я использую IE9.0.8112.16421:

enter image description here

Это код:

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

Ответы

Ответ 1

Две вещи:

Тег <canvas> должен иметь соответствующий закрывающий тег </canvas>. Хотя некоторые браузеры позволят вам пройти с помощью только тега открытия, другие (например, Firefox и, возможно, IE) не будут.

Кроме того, IE9 требует, чтобы объявление типа HTML5 использовало тег canvas. Вы можете сделать это, разместив <!DOCTYPE html> в верхней части вашего кода.

Ответ 2

Если IE9 работает в режиме совместимости, тэг canvas не будет распознан, даже если вы используете тег HTML5 DOCTYPE. По крайней мере, это был мой опыт.

Проверьте, работает ли IE9 в режиме совместимости, что может иметь место, если сайт находится в интрасети.

Ответ 3

<!DOCTYPE html> должно быть первым, что есть на вашей странице. У меня был script перед тегом, и он продолжал давать мне ту же ошибку. Это происходит только в IE9, Chrome и Firefox работают даже с script перед тегом doctype.

Ответ 4

Запуск IE 9.0.8112.16421. Элемент Canvas не будет работать изначально, но если я нажму F12, чтобы открыть devtools, а затем обновиться, он начнет работать. Нормальное обновление без открытия окна devtools не будет работать. Может быть проблемой JS init, поскольку холст работал до того, как я переместил код рисования холста в свой собственный .js файл. Прекрасно работает в Chrome/Firefox/Safari.

Ответ 5

при использовании IE10 в режиме совместимости проверьте версию совместимости IE. Войдите в F12 (откройте Инструменты разработчика) и проверьте соответствующую версию IE (например, IE9), в которой вам нужны тестер и браузер будет работать под этой версией.