webshim polyfill canvas won't work in IE7 mode
I am having problems getting the webshims plugin canvas polyfill to work.
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');
开发者_Python百科 context.fillStyle='#F00';
context.fillRect(0,0,700,350);
//]>
</script>
</body>
</html>
The problem happens whether I use the default (excanvas) or flashpro.
UPDATE: It appears to me that getContext() is returning a jQuery object instead of a context.
Help, please?
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.
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);
});
You find more informations about your problem in the documentation @ http://afarkas.github.com/webshim/demos/index.html#polyfill-ready
加载中,请稍侯......
精彩评论