svg

Is there an equivalent of spriting for SVG images in web pages?

SVG images aren’t bitmaps, so (unless I’m missing something) you can’t do spriting like you can with other images files used on web pages (see http://www.alistapart.com/articles/sprites). But is there an equivalent mechanism to display only part of an SVG image as a CSS background? E.g. imaginary syntax: div.my-special-svg-div { b...

Click Event for SVG Rectangle

I'm using SVG together with jQuery in my Mvc Application. I draw a series of rectangles on my page and what I would like to do is attach a click or mouseover event for each rectangle, for say, popup an alert box. I've tried something like this, so far: $("rect[id='Y6']").attr('onclick', function() { alert("Hello!") }); and $("rect[id=...

Using CSS @font-face with the iPad/iPhone

I'm trying to use the font-face attribute of CSS with a custom font: @font-face { font-family: "Handvetica"; src: url("Handvetica.eot"); src: url("Handvetica.ttf") format("truetype"), url("Handvetica.otf") format("opentype"), url("Handvetica.woff") format("woff"), url("Handvetica.svg#Handvetica") format("svg");...

Optimize SVG game

I have created my first SVG game, using Raphaël.js. In Chrome the game feels fast, but in other browser like IE (understandable since it's using VML), Firefox, iPad safari and others, it feels slow at times. I'm looking for some tips on how I can optimize my code to squeeze out the absolute best performance. I've tried the best I can t...