¿Por qué mi IE9 no es compatible con canvas?


DiveIntoHTML5 Canvas afirma que IE9 soporta canvas.

Sin embargo, cuando intenté hacer canvas en IE9, no funciona:

El objeto no soporta la propiedad o método 'getContext'

Estoy usando IE9.0.8112.16421:

introduzca la descripción de la imagen aquí

Este es el código:

<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>
Author: Pacerier, 2011-05-30

6 answers

Dos cosas:

La etiqueta <canvas> debe tener una etiqueta de cierre correspondiente </canvas>. Mientras que algunos navegadores le permitirán sobrevivir con solo una etiqueta de apertura, otros (como Firefox, y tal vez IE) no lo harán.

Además, IE9 requiere que declare un doctype HTML5 para usar la etiqueta canvas. Puede hacer esto colocando <!DOCTYPE html> en la parte superior de su código.

 52
Author: Jeff,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-05-30 08:44:40

Si IE9 se está ejecutando en modo de compatibilidad, la etiqueta canvas no se reconocerá, incluso si está utilizando la etiqueta DOCTYPE HTML5. Al menos esa ha sido mi experiencia.

Compruebe si IE9 se está ejecutando en modo de compatibilidad, que puede ser el caso si el sitio está en una intranet.

 14
Author: Mike Strother,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-03-19 20:04:18

<!DOCTYPE html> debe ser lo primero en tu página. Tenía un script antes de la etiqueta y me seguía dando el mismo error. Esto solo sucede en IE9, Chrome y Firefox funcionan incluso con un script antes de la etiqueta doctype.

 6
Author: Tadiotto,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-03-01 18:50:18

Ejecutando IE 9.0.8112.16421. El elemento Canvas no funcionará inicialmente, pero si presiono F12 para abrir devtools, luego refresco, comienza a funcionar. Normal refresh w / o devtools ventana abierta no funcionará. Puede ser un problema de inicio de JS ya que el lienzo estaba funcionando antes de que moviera el código de dibujo del lienzo a su propio .archivo js. Funciona bien en Chrome / Firefox / Safari.

 1
Author: Ray,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-08-05 08:46:45

Cuando use IE10 en la vista de compatibilidad, compruebe la versión de compatibilidad de IE. Introduzca F12 (open developer Tools) y comprobar IE apropiado (por ejemplo IE9) versión que necesita prueba y navegador trabajaré justo debajo de esta versión.

 1
Author: Karen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-02-05 12:11:27

¡Chicos!

Echa un vistazo a Explorer Canvas en Google Code: https://code.google.com/p/explorercanvas /

Espero que esto ayude!

Tze

 0
Author: TzeMan,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-05-22 19:08:32