web-dev-qa-db-ja.com

IE9がキャンバスをサポートしていないのはなぜですか？

DiveIntoHTML5 Canvas IE9がキャンバスをサポートしていると主張しています。

ただし、IE9でcanvasを試してみたところ、機能しません。

オブジェクトはプロパティまたはメソッド '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>
javascriptcanvasinternet-explorer-9
25
Pacerier

2つのこと：

<canvas>タグには、対応する終了タグ</canvas>が必要です。一部のブラウザーでは、開始タグのみで問題を解決できますが、他のブラウザー（FirefoxやIEなど）では許可されません。

さらに、IE9では、canvasタグを使用するためにHTML5 doctypeを宣言する必要があります。これを行うには、コードの先頭に<!DOCTYPE html>を配置します。

52
Jeff

IE9が互換モードで実行されている場合、HTML5 DOCTYPEタグを使用していても、canvasタグは認識されません。少なくともそれは私の経験でした。

IE9が互換モードで実行されているかどうかを確認します。これは、サイトがイントラネット上にある場合に当てはまります。

14
Mike Strother

<!DOCTYPE html>は、ページの最初のものでなければなりません。タグの前にスクリプトがあり、同じエラーが発生し続けました。これはIE9でのみ発生し、ChromeおよびFirefoxはdoctypeタグの前のスクリプトでも機能します。

6
Tadiotto

互換表示でIE10を使用する場合は、IE互換バージョンを確認してください。F12（開発者ツールを開く）を入力して、テストが必要な適切なIE（たとえばIE9））バージョンを確認してくださいそしてブラウザはこのバージョンの直下で動作します。

1
Karen

実行中IE 9.0.8112.16421。Canvas要素は最初は機能しませんが、F12を押してdevtoolsを起動して更新すると、機能し始めます。devtoolsウィンドウを開いていない通常の更新は開きませんキャンバスの描画コードを独自の.jsファイルに移動する前にキャンバスが機能していたため、JS initの問題である可能性があります。Chrome/ Firefox/Safariで正常に機能します。

1
Ray

みんな！

Google CodeのExplorer Canvasを確認してください： https://code.google.com/p/explorercanvas/

お役に立てれば！

ツェ

0
TzeMan