Modernizr は MIT ライセンスのオープンソースライブラリ。HTML5/CSS3のサポートがあるかどうかを簡単に判断することができる。
1 2 3 4 5 | <head> <meta charset="utf-8"> <title>Dive Into HTML5</title> <script src="modernizr.min.js"></script> </head> |
1 2 3 4 5 6 7 | if (Modernizr.canvas) { // let's draw some shapes! } else { // no native canvas support available :( } |
nomodernizr_init() という関数が、Modernizr というグローバルオブジェクトを作成するので、上記のようにサポートされているか確認する。
内部では、
1 2 3 4 5 6 | if (Modernizr.canvas) { function supports_canvas_text() { if (!supports_canvas()) { return false; } var dummy_canvas = document.createElement('canvas'); var context = dummy_canvas.getContext('2d'); return typeof context.fillText == 'function’; } |
このようにダミーの canvas をエレメントを作成し、メソッドがあるか確認している。
