IEでもcanvasを使いたい!
本記事の冒頭で説明したとおり、IEはcanvas機能をサポートしていませんが、グーグルが提供している「Google Chrome Frame」プラグインをインストールすると、Google Chromeと同じようにcanvasが使えます。Google Chrome Frameは、IEの見た目はそのままに、レンダリングエンジンをGoogle Chromeと同じWebKitに変更するプラグインです。JavaScriptエンジンもGoogle Chromeと同じになり、処理速度も向上します。
Google Chrome Frameは以下のページからダウンロードできます。
http://code.google.com/intl/ja/chrome/chromeframe/
![]() |
|---|
| Google Chrome Frameのダウンロードページ |
右上の「Get Google Chrome Frame」ボタンをクリックすると、以下のような画面になります。Optionalのチェックは入れても入れなくても構いません。「Accept and Install」のボタンをクリックしてダウンロードします。
![]() |
|---|
| 「Accept and Install」のボタンをクリック |
![]() |
|---|
| インストーラーをダウンロードして保存する(保存ボタンをクリック) |
![]() |
|---|
| ここではデスクトップに保存する |
![]() |
|---|
| 保存したらChromeFrameSetup.exeアイコンをダブルクリックして起動する。セキュリティ警告のダイアログが表示されたら「実行」ボタンをクリックする |
![]() |
|---|
| ダウンロードとインストールが開始される |
![]() |
|---|
| 正常にインストールが完了するとこの画面になる |
あとは、HTMLに以下のmetaタグを追加するだけです。
<meta http-equiv="X-UA-Compatible" content="chrome=1">
これで自動的にレンダリングエンジンがWebKitに切り替わり、canvas機能を利用できるようになります。
![]() |
|---|
| metaタグが記述されていないとIEのレンダリングエンジンとJScriptが使用されるためエラーで動作しない |
![]() |
|---|
| metaタグを追加するとIEでもcanvasの機能が使える |
この連載の記事
- 第53回 Mac用ウィジェットをHTML/CSSで自作
- 第52回 Web技術で作るDashboardウィジェット開発入門
- 第51回 iOS 4.2×localStorageで作るGPSレコーダー
- 第50回 HTML5 SVGで作るシューティングゲーム
- 第49回 HTML5のInline SVGをJavaScriptで操作
- 第48回 HTML5で注目!インラインSVGの使い方
- 第47回 iOS 4.2の新機能で作るHTML5+JSアプリ
- 第46回 JavaScriptでEPUBビューアーを自作してみた
- 第45回 Audio Data APIでブラウザーをシーケンサーに!
- 第44回 Firefoxでソフトシンセも作れるAudio Data APIの使い方
- この連載の一覧へ


























![Microsoft Windows7 Home Premium 64bit 日本語 DSP版 + メモリ [DVD-ROM] Microsoft Windows7 Home Premium 64bit 日本語 DSP版 + メモリ [DVD-ROM]](http://ascii.jp/img/amazon_noimg70.gif)




