Fatal编程技术网
  • canvas/
  • 使用excanvas polyfill的IE 8画布：无错误，但动画未在IE 8上运行

使用excanvas polyfill的IE 8画布：无错误，但动画未在IE 8上运行

canvas internet-explorer-8 html5-canvas

使用excanvas polyfill的IE 8画布：无错误，但动画未在IE 8上运行,canvas,internet-explorer-8,html5-canvas,polyfills,Canvas,Internet Explorer 8,Html5 Canvas,Polyfills,我有一个使用画布的动画，在Chrome中运行良好。我正在使用excanvas polyfill为IE 8提供支持。我使用IE条件标签在头部附加excanvas，如图所示 | 简化的HTML： <head> <meta charset="utf-8"> <!--[if gte IE 9]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]

我有一个使用画布的动画，在Chrome中运行良好。我正在使用excanvas polyfill为IE 8提供支持。我使用IE条件标签在头部附加excanvas，如图所示

|

简化的HTML：

<head>
    <meta charset="utf-8">
    <!--[if gte IE 9]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]-->
    <!--[if lt IE 9]><meta http-equiv="X-UA-Compatible" content="IE=7" /><![endif]-->

    <link rel="stylesheet" href="css/normalize.min.css">
    <link rel="stylesheet" href="css/ecard.css">

    <script src="js/vendor/modernizr-2.6.2.min.js"></script>
    <!--[if lt IE 9]><script src="js/vendor/excanvas.js"></script><![endif]-->
</head>
<body>
    <canvas id="card" width="1000" height="750"></canvas>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>

    <script src="js/ecard.js"></script>
</body>
当我尝试从IE8运行动画时，它什么也不做。我在IE8开发工具中没有看到错误。然而，当我输入
ctx.fillRect（25,25100100）在IE8开发者工具控制台中运行，我得到错误“'ctx'未定义”


从IE8开发者工具来看，excanvas.js似乎加载正确。有什么想法吗？
尝试在头部添加以下内容：


<meta http-equiv="X-UA-Compatible" content="IE=7" />


尝试：


var canvas = (typeof(G_vmlCanvasManager) != 'undefined') ? G_vmlCanvasManager.initElement($("canvas#card")[0]) : $("canvas#card")[0];

ctx = canvas.getContext('2d');



但是，当我键入
ctx.fillRect（25,25100100）时，这消除了错误“对象不支持此属性或方法”
进入IE 8 developer tools中的控制台并单击“运行脚本”，我得到一个错误“'ctx'未定义”@MikeEng最后一个错误是因为ctx是在加载文档时调用的匿名函数的范围内定义的。如果移动
var ctx到全局范围，您应该能够从控制台使用它。希望这有帮助。谢谢，但实际上ctx已经在全局范围内声明了。我没有在问题中包含这部分代码，但请参见github.com/mrengy/xmas-ecard/blob/master/js/ecard.js

ctx = $("canvas#card")[0].getContext('2d');



var canvas = (typeof(G_vmlCanvasManager) != 'undefined') ? G_vmlCanvasManager.initElement($("canvas#card")[0]) : $("canvas#card")[0];

ctx = canvas.getContext('2d');