SMIL Transition

Οι Transition μπορούν να δημιουργήσουν αποτελέσματα όπως

Οι Transition ανήκουν στο SMIL 2.0

Οι Transition είναι νέα χαρακτηριστικά του SMIL 2.0. Οι Transition δεν είναι μέρος του κανονισμού SMIL 1.0.

O Internet Explorer 6 υποστηρίζει τις Transition βασισμένες στον κανονισμό SMIL 2.0. Οι Transition υλοποιούνται από το στοιχείο <transitionfilter>.

όρισμα

<transitionfilter> στοιχεία έχουν διάφορα στοιχεία, με τα πιο συχνά να είναι:

όρισμα περιγραφή παράδειγμα
type Ορίζετε τον τύπο του φίλτρου transition (βλέπε την λίστα με τα φίλτρα transition) type="clockWipe"
begin Ορίζετε πότε ξεκινά η transition begin="0s"
mode Ορίζετε τον τύπο της transition mode="in"
from Ορίζετε την αρχική τιμή της transition from="0.2"
to Ορίζετε την τελική τιμή της transition to="0.8"

Φίλτρα Transition

το χρησιμοποιήσετε τις παρακάτω transition φίλτρα:

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

Example: Display 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>

In the example above, the image will be displayed for 4 seconds. The Transition filter will display the image in the 'clockWipe' style for 2 seconds.

Hint:You must run Internet Explorer 6 to display this example.

Try It Yourself (TIY)