si

svg-inject

Replace an `<img>` element with an inline SVG.

Showing:

Popularity

Downloads/wk

114

GitHub Stars

11

Maintenance

Last Commit

4yrs ago

Contributors

1

Package

Dependencies

2

Size (min+gzip)

1.7KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

svg-inject experimental

Replace an <img> element with an inline SVG. This way you can still earn the benefits of not inlining every occurence of an SVG, but still style their contents using CSS selectors. This makes adding hover states and the like much more straightforward :)

Usage

NPM

inject(element, [callback])

Replace the <img> element with an SVG, calling callback(err, svg) when complete.

// Replaces all existing SVG images on the DOM with inline SVGs:
var inject = require('svg-inject')
var svgs = document.querySelector('img[src$=".svg"]')

for (var i = 0; i < svgs.length; i++) {
  inject(svgs[i], function(err, svg) {
    if (err) throw err
    // do additional things with `svg` here if you like.
  })
}

See Also

License

MIT. See LICENSE.md for details.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100