SMIL Sequence

<seq> - ×î³£ÓÃµÄ SMIL ÔªËØ - ¶¨ÒåÐòÁС£

ÐòÁÐÔªËØ <seq>

<seq> ÔªËØ¿É¶¨ÒåÐòÁС£<seq> ÔªËØÖеÄ×ÓÔªËØÒÀ´ÎÏÔʾÔÚÐòÁÐÖС£

Äú¿ÉÒÔʹÓà <seq> ÔªËØÀ´¶¨ÒåÒªÏÔʾµÄͼÏñÁÐ±í¡¢¶ÎÂäÁÐ±í¡¢ÊÓÆµÁÐ±í£¬»òÈÎºÎÆäËûµÄÔªËØ¡£

<seq> ÔªËØÓµÓÐÐí¶àÊôÐÔ£¬×î³£ÓõÄÊôÐÔÓУº

ÊôÐÔ Öµ ÃèÊö
begin time ÔÚÔªËØ±»ÏÔʾ֮ǰµÄÑÓ³Ù¡£
dur time ÉèÖÃÏÔʾµÄ³ÖÐøÊ±¼ä¡£
repeatCount number ÉèÖÃÏÔʾµÄÖØ¸´´ÎÊý¡£

ÈçÐèÍêÕûµÄ SMIL ÔªËØºÍÊôÐÔÁÐ±í£¬Çë·ÃÎÊ W3School SMIL ²Î¿¼Êֲᡣ

ʵÀý£ºÏÔʾͼÏñÐòÁÐ

<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:seq repeatCount="indefinite">
  <img class="t" src="image1.jpg" dur="1s" />
  <img class="t" src="image2.jpg" dur="1s" />
</t:seq>

</body>
</html>

TIY

ʵÀý£ºÏÔʾÎı¾ÐòÁÐ

<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:seq repeatCount="indefinite">
  <h2 class="t" dur="1s">
  I will display for one second</h2>
  <h2 class="t" dur="2s">
  I will display for two seconds</h2>
  <h2 class="t" dur="3s">
  I will display for three seconds</h2>
</t:seq>

</body>
</html>

TIY

VUE