 |
 |
| XHTML+SMIL
|
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 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
|
