srcset属性を使ったSVGフォールバック・ハック

SVGをサポートする環境がほとんどになってきた。それでもなんとか8であったり、かんとか2.3であったりのことを考慮せざるをえないという状況はありうる。それにはonerror属性を使った対応が有力だが、srcset属性でSVGファイルを指定するだけというハックのことを知った。将来的に使えなくなるわけではないが、やりたいことと実装に食い違いが少なからずあるのでハックと言って良いだろう。 <img src="foo.png" srcset="foo.svg"> 表示したいSVGをsrcset属性で、フォールバックに使いたいPNGをsrc属性で指定するだけだ。これでsrcset属性をサポートしているブラウザーではSVGが、そうでないブラウザーではPNGが表示される。srcset属性のサポートに対して、より多くのブラウザーがSVGをサポートしていることから成立する。もちろん食い違いがあるのでSVGを

[rikuo]

ちなみにインラインSVGのfallbackの実例としてはニューヨークタイムズ http://www.nytimes.com/ 、onerrorはメジャーリーグの全チーム 例 http://newyork.yankees.mlb.com/ で使われていたりします。

[mosco-mule]

srcset属性を使ったSVGフォールバック・ハック SVGをサポートする環境がほとんどになってきた。それでもなんとか8であったり、かんとか2. Tags: from Pocket October 05, 2015 at 09:22AM

[neotag]

“つまり計画的に利用しないことは意識したい。”

[oppara]

srcset属性を使ったSVGフォールバック・ハック - Weblog - http://t.co/PMuo53MRxd B!

[ryo_n574]

srcset属性を使ったSVGフォールバック・ハック - Weblog - Hail2u.net

[hiroshi_revolution]

srcset属性を使ったSVGフォールバック・ハック - Weblog - http://t.co/GqA6xcUiTI

[glat_design]

インラインの方知らなかった /