Interactive SVG-SMIL animation tutorial

The educational technology and digital learning wiki
Revision as of 18:30, 10 February 2014 by Daniel K. Schneider (talk | contribs) (Created page with "<pageby nominor="false" comments="false"/> {{web technology tutorial|Intermediate}} {{stub}} == Introduction == This short tutorial will provide an introduction to adding so...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

<pageby nominor="false" comments="false"/>

Draft

1 Introduction

This short tutorial will provide an introduction to adding some interactivity to dynamic SVG, ie. SVG-SMIL animation

Prerequisites:

See also:

  • SVG (Short overview)
  • SVG links (links to various SVG resources)


Alternative reading:

Attention: You must use a recent HTML5 compliant browser (issued 2011 or later), e.g. FireFox, Chrome, Opera or Safari. These examples will not work with Internet Explorer 9.

2 Simple click and mouse-over examples

3 Motion animation

Example:


Alternative examples: