Transition SMIL

Les Transition peuvent générer des effets tels que "fader" et "effacer" pour les éléments.

Les Transition appartiennent à SMIL 2.0

Les Transition sont une nouvelle fonctionnalité de SMIL 2.0. Les Transition ne font pas partie de la norme SMIL 1.0.

Internet Explorer 6 prend en charge les Transition basées sur la norme SMIL 2.0. Les Transition sont implémentées par l'élément <element>transitionfilter</element>.

Propriétés

<element>transitions</element> possède plusieurs éléments, les plus courants étant :

Propriétés Description Exemple
type Définir le type de filtre de transition (voir la liste des filtres de transition) type="clockWipe"
begin Définir quand commencer la transition begin="0s"
mode Définir le mode de transition mode="in"
from Définir la valeur de début de transition from="0.2"
to Définir la valeur de fin de transition to="0.8"

Filtres de transition

Les filtres de transition suivants peuvent être utilisés :

fade, barnDoorWipe, barWipe, clockWipe, ellipseWipe, fanWipe, irisWipe 
pushWipe, slideWipe, snakeWipe, spiralWipe, starWipe

Exemple : Affichage de Transition

<html xmlns:t="urn:schemas-microsoft-com:time">
<head>
<?import namespace="t" implementation="#default#time2">
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
<t:transitionfilter targetelement="keyb"
type="clockWipe"
begin="keyb.begin" dur="2s" />
<img id="keyb" class="t" src="pic_keyb.jpg" dur="4s"
width="128" height="107" />
</body>
</html>

Dans l'exemple ci-dessus, l'image sera affichée pendant 4 secondes. Le filtre de transition affichera l'image en 2 secondes de manière "clockWipe".

Astuce :Vous devez exécuter Internet Explorer 6 pour afficher cet exemple.

TIY