SVG image sprites? Is it possible or not?

Has anyone ever used SVG for image sprites? I want to replace a bunch of very similar GIFs and JPGs with some SVG scalable images, but the characteristics of the image gradient and button shape bloat the SVG.

If I could create a stacked chart, I could reuse the shapes of the gradients and base buttons, etc. I'm just not sure if it is possible to reference SVG images inside (say) a CSS document. I assume this is not the case, since you need to use SVG via embed or object tags, not img tags.

Perhaps I could programmatically using jquery, for example, take snippets of the main SVG document and use that to compose SVG images on demand. But I'm guessing it will be pretty slow?

Thank,

Andrew Matthews

+2


source to share


1 answer


Here's my example of using SVG in <img>

and in the form of a pure drawing element, not <canvas>

working in Opera 9.5 and up IIRC:

http: //dahlström.net/svg/presentations/svgdemos/canvas2d.html



Webkit does svg on <img>

elements as well, and the example above sorts work in the version of the Epiphany website that I tested now (needs an update to see the tiger, but it was drawn to the canvas as expected).

+1


source







All Articles