SVG for images in browsers with PNG fallback

Question

I\'m looking to use SVG versions of a company logo on a website. At present, all current versions of major browsers (IE, Safari, Chrome, Firefox, Opera) support SVG, so this

Answer 1

This is an old question, but here is another solution:

1. Download a version of Modernizr that is trimmed down to just testing SVG (assuming that’s the only test you need).

2. Run the test. If it passes, put in the SVG. If it fails, put in the bitmap. Essentially:

   if (!Modernizr.svg) { 
       $("#logo").css("background-image", "url(fallback.png)"); 
   }
   

SVG is a perfect use case for Modernizr, because there is no simple native way to provide a fallback.

Note: The browser don't load both (png and svg) versions.

For the record: the only reason you would need a fallback for SVG these days if you have to support IE 8 and down, or older Android.