How I SVG'd

by Erik Woods

HTML

<p>In conjunction with Modernizr, I recently came up with this bit of jQuery to replace all .svg images with .png images when not supported.</p>

<p>Seems to be working pretty well so far, since I already depend on Modernizr and jQuery in my app.</p>

<p>Only downside is... I believe it makes two http requests when it has to replace the png.</p>

<pre><code>
$('.no-svg img').each(function () {
    $(this).attr('src', $(this).attr('src').replace(/\.svg/, '.png'));
});
</code></pre>

<footer>
    <p><a href="http://erikwoods.com" target="_blank">Fiddle by Erik Woods</a> | <a href="http://jsfiddle.net/user/erikwoods/fiddles/" target="_blank">Other Fiddles by Erik Woods</a></p>
</footer>

CSS

p {
    margin: 0 0 10px 0;
}

footer {
    background: #ff0;
    border: 0 none;
    border-top: 1px solid #000;
    bottom: 0;
    color: #000;
    padding: 10px;
    position: fixed;
    width: 100%;
}

footer p {
    margin: 0;
}