Discuss: Using SVG for Flexible, Scalable, and Fun Backgrounds, Part II
by Shelley Powers
- Editorial Comments
2 SVG FTW!
Hi Shelley, great article(s)! I did a little demo a while back on using SVG and background masks to create scalable graphics: http://www.alexandtheweb.com/2009/08/skinnable-icons-with-css3-gradients-and-background-masks/ :)
posted at 10:13 am on January 26, 2010 by alexandtheweb
3 Code sample boo-boo?
Hey Shelley, cool article, but is that </span> supposed to be in the first code sample above?
I totally love that people are using this, but with all the limitations still, I honestly don’t see myself diving in too deeply just yet…
But thanks, I love to see new uses, and hope someday this will finally come of age…
Atg
posted at 10:25 am on January 26, 2010 by Aaron Grogg
4
I’ve heard a lot about SVG already, but never bothered to look at it in detail. Reading these articles got eager to learn more about SVG!
posted at 11:14 am on January 26, 2010 by brechtvhb
5 Example 4 not working in Firefox 3.6?
I also can’t see anything but text in Firefox 3.6. Example 3, on the other hand, displays just fine.
posted at 12:22 pm on January 26, 2010 by Isabella Schlögl
6 Can SVG replace Flash?
I just a novice on SVG.
I would like to know if SVG can replace Flash as used in the web (other than video and audio —handled by HTML5 tags—).
I suppose that JavaScript can handle dynamics.
Is there any other way of doing animations than “hand coding”?
Is there any application that let “non-programing artist” work easyly with SVG?
posted at 02:08 pm on January 26, 2010 by lmasanti
7 Examples
Thanks for kind words, folks.
The example 4 is a demonstration of using SVG in HTML via the HTML5 spec. The only browser that supports this currently is Firefox 3.6. And unfortunately, we’re now finding out Firefox 3.6 only seems to support it in the Mac.
SVG-in-HTML5 support is enabled by default, and it is showing in my Mac Firefox 3.6, but just checked with an updated Windows version, and it isn’t. Well, isn’t this fun? Which just goes to show that SVG-in-HTML is still very new, very raw, and you might want to stick with either SVG-in-XHTML, or use the scripting libraries such as SVGWeb to incorporate in HTML. It will be a few years before we see widespread support for SVG in HTML.
Aaron, yes, that object code is copied as is directly from Jeff’s site. The span would normally enclose fallback text.
Imasanti, several applications support SVG, including Inkscape and Adobe Illustrator. I don’t think there’s a Flash-like equivalent for SVG, yet. I know folks were looking at creating one of these a year or so ago.
posted at 03:11 pm on January 26, 2010 by Shelley Powers
8 Great article
Alexa, great article. Thanks for posting link.
posted at 03:17 pm on January 26, 2010 by Shelley Powers
9 Not this Mac
Example four doesn’t work for me either. Is Snow Leopard the problem perhaps?
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6
posted at 03:18 pm on January 26, 2010 by Michael Newton
Got something to say?
Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.
Create a new account or sign in below if you’d like to leave a comment.
Subscribe to this article's comments: RSS (what’s this?)
1 Example 4 does nothing for me
Otherwise . . . great articles!
posted at 09:27 am on January 26, 2010 by Tuurlijk