SMIL XHTML

XHTML+SMIL li lascer� scrivere il codice di SMIL in un documento valido di XHTML. Aggiungere la sincronizzazione, la animazione, la transizione ed altri elementi di SMIL ai vostri Web pagi. Essere appena informato che a partire dal Internet di oggi Explorer>5.5 � l'unico browser della scelta.

Un senso semplice di spiegazione del profilo di XHTML+SMIL � dicendo quali moduli di SMIL non contiene

Modulo della disposizione: Il modulo della disposizione di SMIL 2.0 non � incluso. Il modello della disposizione di XHTML/CSS fornisce la funzionalit� della disposizione.

Collegamento del modulo: Il modulo di collegamento di SMIL 2.0 non � incluso, poich� XHTML fornisce il collegamento della funzionalit�.

Modulo della struttura: Il modulo della struttura di SMIL 2.0 non � incluso, mentre il documento di XHTML � definito per essere la lingua ospite ed in modo da fornisce gli elementi e la semantica equivalenti.

Modulo di Metainformation: Il modulo di SMIL 2.0 Metainformation non � incluso, poich� XHTML fornisce la funzionalit� di meta dati.

I moduli di SMIL che allora sono lasciati sono:

Animation Module

Content Control Module

Media Object Module

Timing and Synchronization Module

Time Manipulations Module

Transition Effects Module

Questo i moduli dovrebbero essere abbastanza da giocare con, poich� la funzionalit� �di mancanza� dei moduli completamente � sostenuta in XHTML/CSS.

Namespace

Namespace elements are included with a SMIL namespace declaration:

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:smil="http://www.w3.org/2001/SMIL20">

HTML+TIME

HTML+TIME � basato (X) sul profilo di HTML+SMIL. � esecuzione del Microsoft in Internet Explorer ed usa il comportamento dell'elemento time2. Un namespace differente � usato ma ha gran parte del funcionality descritto per XHTML+SMIL. Associando gli elementi con il comportamento time2 che usando un attributo del codice categoria di CSS ci d� questa lima minima:

<html xmlns:t="urn:schemas-microsoft-com:time">
<head>
<?import namespace="t" implementation="#default#time2">
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
</body>
</html>

Sotto � la fonte per la presentazione del sig. Zebra che � stata introdotta nella sezione della sezione dell'introduzione. La differenza grande � disposizione di schermo poich� il modulo della disposizione di SMIL non � incluso. Invece ho usato lo stile in-linea di CSS per descrivere la disposizione di schermo. Inoltre ho scelto includere gli testo-elementi usando il <p> invece di includerli come testo-lime.

<HTML XMLNS:t ="urn:schemas-microsoft-com:time">
<HEAD>
<STYLE>
< .time {behavior: url(#default#time2);}>
</STYLE>
<?IMPORT namespace="t" implementation="#default#time2">
</HEAD>

<BODY width="640" height="560" bgcolor="#FFFFFF">
<t:par>

<t:audio src="audio/Mr._Zebra.mp3" alt="Mr. Zebra perfomed by
Tori Amos" dur="19.6s"/>

<img class="time" src="images/zebra.jpg" alt="a zebra" width="640"
height="480" dur="18s" style="position: absolute; left: 0px; top: 0px;
width: 640px; height: 480px;"/>

<p class="time" dur="8s" style="position: absolute; left: 0px;
top: 480px; width: 640px; height: 80px; background-color:#FFFFFF" >
Hello Mr. Zebra</p>

<p class="time" begin="10s" style="position: absolute; left: 0px;
top: 480px; width: 640px; height: 80px; background-color:#FFFFFF">
Ratatouille Strychnine</p>

<p class="time" begin="13s" style="position: absolute; left: 0px;
top: 480px; width: 640px; height: 80px; background-color:#FFFFFF" >
sometimes she's a friend of mine</p>

<img class="time" src="images/sweater.jpg" alt="a sweater" begin="4s"
style="z-index:1; position: absolute; left:500px; top:360px; width:140;
height:120"/>

<img class="time" src="images/snow2_oil.jpg" alt="snow" begin="5.5s"
style="z-index:1; position: absolute; left:500px; top:240px; width:140;
height:120"/>

<img class="time" src="images/snow1_oil.jpg" alt="snow" begin="6s"
style="z-index:1; position: absolute; left:500px; top:120px; width:140;
height:120"/>

<img class="time" src="images/snow1_charcoal.jpg" alt="snow"
begin="6.5s" style="z-index:1; position: absolute; left:500px;
top:0px; width:140; height:120"/>

<img class="time" src="images/zebra_swirl80.jpg" alt="a swirled zebra"
begin="18s" style="position: absolute; left: 0px; top: 0px;
width: 640px; height: 480px;"/>

</t:par>
</BODY>
</HTML>

Keywords: xhtml examples, xhtml tutorial, smil player, smil tutorial, xhtml example, smil example, smil multimedia, xhtml editor, mms smil, w3c xhtml, xml xhtml, text xhtml, xhtml xslt, smil text, xsl xhtml, xhtml svg, xhtml dtd, xhtml reference, xhtml tags, xhtml cdata, xhtml namespace, xhtml template, xhtml stylesheet, xhtml attributes, xhtml javascript, embed xhtml, layout xhtml, xhtml code, xhtml tag xhtml element, xhtml document, xhtml attribute, css xhtml, using xhtml

HTML Quizes

XML Quizes