SVG Parameters

Heya everyone, I've been threatening to merge Doug's old SVG
Parameters spec with CSS Variables for some time.  I just now got
around to it:

https://tabatkins.github.io/specs/svg-params/

Basic idea is to introduce a param() fragment identifier that can
specify a custom property, like:

http://example.com/image.svg#param(--color%20blue)

Within CSS, where you might want to pass one of the page's own custom
properties down into a referenced SVG, the url() function sprouts a
param() function as well:

background-image: url("image.svg" param(--color var(--page-color)));

Either syntax sets the initial value of the given custom property to
the given value, allowing it to be used in any CSS properties on the
page.  (And, I think, presentation attributes, if they're parsed as
CSS.)

This does not handle passing text content into SVG, at least until
<text> allows the 'content' property to work.  However, the styling
possibilities are significant.

Thoughts?

~TJ

Received on Wednesday, 16 September 2015 02:19:25 UTC