SMIL in HTML

Internet Explorer può eseguire presentazioni SMIL nei file HTML.

Esegui presentazioni SMIL in IE

Con Internet Explorer 5.5 o versione successiva, è possibile inserire elementi SMIL nei file HTML.

In questo modo, qualsiasi presentazione SMIL può essere eseguita come file HTML standard su Internet.

Aggiungi il riferimento

Per utilizzare gli elementi SMIL in HTML, devi definire uno spazio dei nomi "time" per Internet Explorer in modo che possa riconoscere questi elementi. Ecco come fare:

  • Aggiungi la definizione di spazio dei nomi alla etichetta <html>
  • Aggiungi un elemento <?import> per importare lo spazio dei nomi "time"

Per aggiungere attributi SMIL agli elementi HTML standard, devi definire una classe "time" per Internet Explorer in modo che possa riconoscere questi attributi. Ecco come fare:

  • Aggiungi un elemento <style> per definire la classe "time"
<html xmlns:time="urn:schemas-microsoft-com:time">
<head>
  <?import namespace="time" implementation="#default#time2">
  <style>.time {behavior: url(#default#time2)}</style>
</head>

Nel paragrafo successivo, puoi vedere un esempio di esecuzione completo.

Aggiungi l'elemento SMIL

Per eseguire SMIL in HTML, è sufficiente aggiungere un prefisso e un attributo class a un elemento SMIL:

<time:seq repeatCount="indefinite">
  <img class="time" src="image1.jpg" dur="3s" />
  <img class="time" src="image2.jpg" dur="3s" />
</time:seq>

Negli esempi precedenti, abbiamo aggiunto la classe "time" agli elementi <img> e l'prefisso "time" agli elementi SMIL.

Suggerimento:Le classi e gli spazi di nomi non devono necessariamente chiamarsi "time". Qualsiasi nome può essere utilizzato.

Un'istanza di Internet Explorer

<html xmlns:time="urn:schemas-microsoft-com:time">
<head>
  <?import namespace="time" implementation="#default#time2">
  <style>.time {behavior: url(#default#time2)}</style>
</head>
<body>
  <time:seq repeatCount="indefinite">
    <img class="time" src="image1.jpg" dur="3s" />
    <img class="time" src="image2.jpg" dur="3s" />
  </time:seq>
</body>
</html>

TIY