Home arrow Multimedia arrow Page 7 - Learning To SMILe

A Click In Time... - Multimedia

Take a tour of SMIL, the Synchronized Multimedia Integration Language, and find out how you can use it to quickly and rapidly build Web-based multimedia offerings incorporating multiple media types.

  1. Learning To SMILe
  2. Getting The Tools
  3. Anatomy 101
  4. Laying It Out
  5. Spending Time
  6. Playing In Sync
  7. A Click In Time...
  8. Bedtime Reading
By: icarus, (c) Melonfire
Rating: starstarstarstarstar / 8
November 21, 2002

print this article


SMIL 2.0 also allows you to create clickable hyperlinks using the and tags. Here's an example:

... <a href="http://www.some.host/smil/example.smil"> <img id="image" src="image.jpg" region="alpha"/> </a> ...
The <a> and </a> elements here are similiar to their HTML counterparts, and can be used to launch new SMIL presentations, either within the current window or in a new window. In the example above, clicking the hyperlink would replace the current SMIL presentation with the new one located at the specified URL.

As with regular HTML, it's also possible to specify a target for the hyperlink consider the following example, which launches the target of the link in a different region of the current window.

... <layout> <root-layout width="800" height="800" backgroundColor="white"> <region id="alpha" left="20" top="20" width="100" height="100" /> <region id="beta" left="150" top="150" width="200" height="200" /> </layout> ... <a href="http://www.some.host/smil/example.smil" target="beta"> <img id="image" src="image.jpg" region="alpha"/> </a> ...
Additionally, the <area /> element can be used to mark spots on a media clip as clickable hyperlinks, in much the same way as an HTML image map. Consider the following example, which demonstrates:

... <img src="logo.jpg" region="img"> <area href="alpha.smil" shape="rect" coords="10,20,40,60" /> <area href="beta.smil" shape="rect" coords="100,120,140,160" /> </img> ...
Note that the <area> element must appear as a child of the corresponding media type element.

It's also possible to control the period of time for which a link is active, by specifying appropriate "begin", "end" and "dur" parameters for each hyperlink. Consider the following example,

... <img src="logo.jpg" region="img"> <area href="alpha.smil" shape="rect" coords="10,20,40,60" end="11s" /> </img> ...
where the first link is active for 11 seconds only.

>>> More Multimedia Articles          >>> More By icarus, (c) Melonfire

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort


- Basic Lighting in OpenGL and SDL Game Progra...
- Working with Colors in OpenGL for Game Progr...
- Animation in OpenGL for Game Programming usi...
- Game Programming with SDL: Getting Started w...
- Using OpenGL with SDL for Game Programming
- Learning Sound for Game Programming using SDL
- Game Programming using SDL: Raw Graphics and...
- Game Programming using SDL: Getting Started
- Network Radio With Icecast
- Learning To SMILe

Developer Shed Affiliates


Dev Shed Tutorial Topics: