This is a follow up to my previous post looking into clip paths. Last time around, we dug into the fundamentals of clipping and how to get started. We looked at some ideas to exemplify what we can do with clipping. We’re going to take things a step further in this post and look at different examples, discuss alternative techniques, and consider how to approach our work to be cross-browser compatible.… Read article
Here's a little example that Jeremy Keith used to use in his talks. It's stuck with me as one of the coolest examples of progressive enhancement and Technology Being CoolTM around.
There is this musical notation format called abc. They don't capitalize it. Kinda like npm, which I guess makes sense as it isn't an acronym. But it is the name of something so it's super awkward. Ughakdhk. Anyway.
The format itself is really cool. It's super … Read article
A reader wrote in to tell me we should update our articles about SVG
<use></use> elements. The attribute we always use for them,
xlink:href, is deprecated. Indeed, MDN says:
That's pretty strong language, hence the reader's warning. This is a bit surprising to me, as the SVG 2 thing got a little weird. It looks like it did become a Candidate Recommendation though.… Read article
From time to time at Stackoverflow, the question pops up whether there is an equivalent to the
stroke-dashoffset technique for animating the SVG
stroke that works for the
fill attribute. But upon closer inspection, what the questions are really trying to ask is something like this:
… Read article
I have something that is sort of a line, but because it has varying brush widths, in SVG it is defined as the fill of a path.
How can this "brush" be animated?