Sample SVG Images and Components Using Interactivity
In this section, I want to show you some examples of constructing SVG Web page “furniture” that demonstrates interactivity.
A mailto graphic
A mailto link on a Web page can be as simple as plain text or, in some cases, a hyperanimated irritation. In this section, you create an interactive, animated mailto graphic—one that doesn’t intrude on the user experience.
The graphic looks like an envelope. When you mouse over the graphic, the “flap” opens and the text “Email me” is animated (see Figure 11.01).
Figure 11.01. The completed mailto graphic when it is not moused.
First, create a static ...
Get Designing SVG Web Graphics now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
