SMIL Timing
SMIL 2023-05-25 14:28:12小码哥的IT人生
SMIL Timing
Timing 表示何时开始，并何时结束。
Timelines 和 Timing
大多数 SMIL 元素使用计时属性来定义呈现的时间线。
计时属性定义了元素的开始的时间，以及持续的时间。
下面的表格列出了可能的时间格式：
| 格式 | 例子 |
|---|---|
| hh:mm:ss.f |
|
|
number [h|min|s|ms] |
|
|
wallclock (YYY-MM-DDThh:mm:ss+zone) |
wallclock(2003-08-01T12:10:30+1.00) ( 12 点之后 10 分 30 秒, 2003 年 8 月 1 日, 协调世界时 + 1 小时) |
值 "indefinite" 可用于定义不结束的循环。
持续时间
元素的持续时间（duration，dur="5s"） 属性定义了元素的可见时长：
<html>
<head>
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
<img class="t" src="image1.jpg" dur="5s" />
</body>
</html>
完整实例【TIY】：
<html>
<head>
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
<img class="t" src="/i/eg_sun.gif" dur="3s" />
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
从何时开始？
begin (begin="2s") 属性定义元素从何时起可见（开始播放）：
<html>
<head>
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
<img class="t" src="image1.jpg" begin="2s" />
</body>
</html>
完整实例【TIY】：
<html>
<head>
<style>.t {behavior: url(#default#time2)}</style>
</head>
<body>
<img class="t" src="/i/eg_sun.gif" begin="3s" />
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
