Combine Multiple PNG Images with SVG

SVGを使ってData URI化したPNG画像をまとめ、:target擬似クラスで表示を切り替えられるようにする。CSSからはハッシュ付きでbackground-image: url("./434.svg#a")として必要な画像にアクセスする。

Test a

Test b

Chrome 20 Data URIが外部リソースとみなされて表示できない
Firefox 13 完璧
Internet Explorer 9 表示可能だが、viewboxが一番大きなPNG画像に引きづられてしまうのでまとめる画像のサイズはすべて同じである必要がある
Opera 12 Data URIが外部リソースとみなされて表示できない