IE レスポンシブ時の画像の出し分けどうしてますか？

Question

IE レスポンシブ時の画像の出し分けそうしてますか？

<!-- レスポンシブイメージテスト -->
<a href="hoge.html">
<picture>
<!--[if IE 9]><video style="display: none;"><![endif]-->
<source media="(max-width:400px)" srcset="/img_a.jpg" sizes="100vw">
<source media="(max-width:599px)" srcset="/img_b.jpg" sizes="100vw">
<source media="(max-width:959px)" srcset="/img_c.jpg" sizes="100vw">
<source media="(max-width:1199px)" srcset="/img_d.jpg" sizes="100vw">
<!--[if IE 9]></video><![endif]-->
<img src="/img_c.jpg" class="img-responsive w100" alt="">
</picture>
</a>

上記のsourceの様に幅で出し分けする事って可能ですか？
※ブラウザが未対応だと思いますが方法はないのでしょうか

Comments

[kei344]

質問文のコードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

[hyksm]

囲んだつもりがなってませんでした。すみません

Answer 1

polyfill があるのでこれを読み込めば非対応のブラウザでも picture要素 が使えるようです。

【GitHub - scottjehl/picturefill: A responsive image polyfill for <picture>, srcset, sizes, and more】
https://github.com/scottjehl/picturefill