Web サイトで SVG ロゴを使用していますが、ほとんどのブラウザで問題なく動作しています。ただし、一部の IE バージョンおよびモバイル ブラウザーでは、画像が失敗した画像ボックスとして表示されます。JS または何らかのライブラリ (できれば jQuery) を使用して、SVG の互換性を最小限の偽陰性でチェックし、単純に画像の .png バージョンに切り替える方法はありますか?
このサイトはhttp://zero31b.x10.mx/samoteで、SVG 画像は小さな青い地球儀です。
Web サイトで SVG ロゴを使用していますが、ほとんどのブラウザで問題なく動作しています。ただし、一部の IE バージョンおよびモバイル ブラウザーでは、画像が失敗した画像ボックスとして表示されます。JS または何らかのライブラリ (できれば jQuery) を使用して、SVG の互換性を最小限の偽陰性でチェックし、単純に画像の .png バージョンに切り替える方法はありますか?
このサイトはhttp://zero31b.x10.mx/samoteで、SVG 画像は小さな青い地球儀です。
Tavmjong Bahは、SVGとPNGのフォールバックに関する包括的な記事を書きました。
http://tavmjong.free.fr/SVG/BUTTON_TEST/button_test.html
彼/彼女が与える最も単純なコードは
<img src="buttonA.svg" alt="A sample SVG button."
onerror="this.removeAttribute('onerror'); this.src='buttonA.png'"/>
ただし、テストする必要のある機能がさらにある場合は、modernizrバージョンを検討することをお勧めします。
pngバージョンを作成するにはSVG- librsvg-convertを使用することをお勧めするgithubのボタンマドロビー