webshim polyfill画布无法在IE7模式下工作 [英] webshim polyfill canvas won't work in IE7 mode
问题描述
我在使webshims插件画布polyfill正常工作时遇到问题.
I am having problems getting the webshims plugin canvas polyfill to work.
在使用IE7模式的IE9中出现以下错误:
I get the following error in IE9 using IE7 mode:
SCRIPT438: Object doesn't support property or method 'fillRect'
problem.html, line 21 character 7
当我尝试运行此代码时:
when I try to run this code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DealingTree</title>
<meta http-equiv="Content-type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="/js/modernizr.js"> </script>
<script type="text/javascript" src="/js/jquery.js"> </script>
<script type="text/javascript" src="/js/sssl.js"> </script>
<script type="text/javascript" src="/js/webshims/js-webshim/minified/polyfiller.js"> </script>
</head>
<body>
<canvas id="savings" height="350" width="700"> </canvas>
<script type="text/javascript">
//<![CDATA[
window.FlashCanvasOptions = { disableContextMenu: true };
$.webshims.setOptions( 'canvas', { type: 'flashpro' } );
$.webshims.polyfill('canvas');
var canvas = $('#savings');
var context = canvas.getContext('2d');
context.fillStyle='#F00';
context.fillRect(0,0,700,350);
//]>
</script>
</body>
</html>
无论我使用默认(excanvas)还是flashpro,都会发生问题.
The problem happens whether I use the default (excanvas) or flashpro.
更新:在我看来,getContext()返回的是jQuery对象而不是上下文.
UPDATE: It appears to me that getContext() is returning a jQuery object instead of a context.
请帮助?
推荐答案
我通过电子邮件收到了插件作者Alexander Farkas的以下解释:
I received the following explanation from the plugin author, Alexander Farkas, via email:
问题如下.网络垫片使用脚本进行异步填充装载机.哪个对性能好在现代浏览器中.这也意味着你必须等到画布功能已准备就绪.
The problem is the following. Webshims does async polyfilling using a script loader. Which is good for performance in modern browsers. This also means, that you have to wait untill the canvas feature is ready.
您的代码应包装在domready事件,一切都很好:
Your code should be wrapped in a domready event and everything is fine:
window.FlashCanvasOptions = { disableContextMenu: true };
$.webshims.setOptions( 'canvas', { type: 'flashpro' } );
$.webshims.polyfill('canvas');
$(function(){
var canvas = $('#savings');
var context = canvas.getContext('2d');
context.fillStyle='#F00';
context.fillRect(0,0,700,350);
});
您找到有关您的更多信息文档中的问题@ http://afarkas.github.com/webshim/demos/index.html#polyfill-ready
这篇关于webshim polyfill画布无法在IE7模式下工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!