2013-03-20 3 views
1

나는 어리석은 짓을하고있어서 두 번째 눈 쌍이 내 어리 석음을 지적하기를 바랍니다. Webshims polyfill이 간단한 캔버스 테스트에서 작동하도록하려고합니다. (처음 사용하는 경우). 크롬과 IE9에서 잘 작동하지만 난 오류가 IE8 및 IE7 (개발자 도구)에서 테스트 : 나는 JQuery와 준비 기능 I에 캔버스 코드를 포장하는 경우HTML 5 Canvas를 IE 8과 7에서 Webshim을 사용하여 작동시키지 못함

Object doesn't support property or method 'getContext'

여기에 내 코드

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> 
     <script src="js-webshim/minified/extras/modernizr-custom.js"></script> 
     <script> 
      // set options for html5shiv 
      if(!window.html5){ 
       window.html5 = {}; 
      } 
      window.html5.shivMethods = false; 
     </script> 
     <script src="js-webshim/minified/polyfiller.js"></script> 
     <script class="example"> 
      window.FlashCanvasOptions = { 
       disableContextMenu: true 
      }; 
      $.webshims.setOptions({ 

       waitReady: false 
      }); 

      $.webshims.polyfill(); 
     </script> 
    </head> 
    <body> 
     <canvas id="my-canvas" width="200" height="100" style="border:1px solid #c3c3c3;"> 
      Your browser does not support the HTML5 canvas tag. 
     </canvas> 
     <script> 
      var ctx = $('#my-canvas').getContext('2d'); 
      ctx.fillStyle = "rgb(200,0,0)"; 
      ctx.fillRect (10, 10, 55, 50); 

      ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; 
      ctx.fillRect (30, 30, 55, 50); 

      window.FlashCanvasOptions = {disableContextMenu: true}; 
      $.webshims.setOptions('canvas', {type: 'excanvas'}); 
     </script> 
    </body> 
</html> 

입니다 오류가 발생하지는 않지만 렌더링 된 캔버스를 얻지 못합니다.

$(function(){ 
    var ctx = $('#my-canvas').getContext('2d'); 
    ctx.fillStyle = "rgb(200,0,0)"; 
    ctx.fillRect (10, 10, 55, 50); 

    ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; 
    ctx.fillRect (30, 30, 55, 50); 
}); 

동일한 결과로 BrowserStack에서 테스트했습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까? 모두를 위해 노출 된 희미한 빛을 보게되어서 기쁩니다 ..!

+0

을 추가하여 고정 나는 것을 시도했다. 오류가 발생하지 않았지만 캔버스에서 렌더링하지 못했습니다. 어쨌든 고마워요 ... – ComfortablyNumb

답변

0

waitReady를 제거하거나 true로 설정해야합니다.

1

오랜 시간이 걸렸지 만 아마도 도움이 될 것입니다.

필자도이 똑같은 오류가 발생했는데 오류는 기록되지 않았지만 캔버스에 아무것도 나타나지 않았습니다. 두 번째 코드에 의해 참조 -

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

나는 내가 한 일을 기억하지 못하고 일하는 중입니다. 그것은 얼마 전이었다! 어쨌든 고마워. – ComfortablyNumb