SMIL XHTML

XHTML+SMIL deixá-lo-á escrever o código de SMIL em um original válido de XHTML. Adicionar o sincronismo, o animation, a transição e os outros elementos de SMIL a seus Web pages. Estar apenas ciente que até à data do Internet de hoje Explorer>5.5 é o único browser da escolha.

Uma maneira simples de explicar o perfil de XHTML+SMIL é dizendo que módulos de SMIL não contêm

Módulo da disposição: O módulo da disposição de SMIL 2.0 não é incluído. O modelo da disposição de XHTML/CSS fornece a funcionalidade da disposição.

Ligando o módulo: O módulo ligando de SMIL 2.0 não é incluído, porque XHTML fornece ligar a funcionalidade.

Módulo da estrutura: O módulo da estrutura de SMIL 2.0 não é incluído, enquanto o original de XHTML é definido para ser a língua do anfitrião, e assim que fornece os elementos e a semântica equivalentes.

Módulo de Metainformation: O módulo de SMIL 2.0 Metainformation não é incluído, porque XHTML fornece a funcionalidade dos metadata.

Os módulos de SMIL que são deixados então são:

Módulo do Animation

Módulo de controle satisfeito

Módulo de objeto dos meios

Sincronismo e módulo da sincronização

Módulo das manipulações de Tempo

A transição efetua o módulo

Este os módulos devem ser bastantes a jogar com, desde que a funcionalidade “faltando” dos módulos é suportada inteiramente em 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 é baseado (X) no perfil de HTML+SMIL. É execução de Microsoft no Internet Explorer e usa o comportamento do elemento time2. Um namespace diferente é usado mas tem muito do funcionality descrito para XHTML+SMIL. Associar elementos com o comportamento time2 que usa um atributo da classe do CSS dá-nos esta lima mínima:

<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>

Abaixo está a fonte para a apresentação do Sr. Zebra que foi introduzida na seção da seção da introdução. A diferença grande é disposição de tela desde que o módulo da disposição de SMIL não é incluído. Instead eu usei o estilo inline do CSS descrever a disposição de tela. Eu escolhi também incluir os texto-elementos usando o <p> em vez de inclui-los como texto-limas.

<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