Entire Site
Free Trial
Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.
- Create BookmarkCreate Bookmark
- Create Note or TagCreate Note or Tag
- DownloadDownload
- PrintPrint
Chapter 11. Animating and Scripting SVG > Animation Basics
11.1. Animation Basics
The animation features of SVG are based on the World Wide Web Consortium's Synchronized Multimedia Integration Language Level 2 (SMIL2) specification http://www.w3.org/TR/smil20/. In this system, you specify the starting and ending values of the attribute, color, motion, or transformation that you wish to animate; the time at which the animation should begin; and the duration of the animation. Example 11-1 shows this in action.
Example 11-1. The incredible shrinking rectangle
Code View:
Scroll
/
Show All <rect x="10" y="10" width="200" height="20" stroke="black" fill="none"> [1]
<animate [2]
attributeName="width" [3]
attributeType="XML" [4]
from="200" to="20" [5]
begin="0s" dur="5s" [6]
fill="freeze" /> [7]
</rect> [8]
|
