Simple jQuery SVG Image Replacement Plugin - replacesvg

File Size: Unknown
Views Total: 675
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple jQuery SVG Image Replacement Plugin - replacesvg

replacesvg is a simple jQuery plugin for SVG Image Replacement for legacy browsers like IE 6/7/8. SVG is an XML-based vector image format that can be searched, indexed, scripted, and compressed. Web browsers which can display SVG images on web pages include Firefox, Internet Explorer (IE 9+), Opera, Safari and Google Chrome.

replacesvg comes with 2 modes:

  • Graceful Degradation Mode: If browser support SVG, do nothing. If not, replace SVG Image with a common image format like png.
  • Progressive Enhancement Mode: If browser support SVG, replace common image with a SVG Image. If not, do nothing.

How to use it:

1. Markup

<!-- Graceful Degradation Mode -->
<img src="star.svg"alt="star" data-altimgsrc="star.png" class="js-replacesvg1">
<!-- Progressive Enhancement Mode -->
<img src="star.png" alt="star" data-altimgsrc="star.svg" class="js-replacesvg2">

2. Include the latest jQuery library and replacesvg plugin on your web page

<script src=""></script> 
<script src="js/jquery.replacesvg.js"></script> 

3. The javascript

// Graceful Degradation Mode
defaultsvg: true
// Progressive Enhancement Mode
defaultsvg: false

This awesome jQuery plugin is developed by FiNGAHOLiC. For more Advanced Usages, please check the demo page or visit the official website.