个性化阅读
专注于IT技术分析

SVG设置元素用法示例

set元素用于设置非数字属性或属性。

它将在某个时间将最初不可见的文本项设置为可见的文本项, 而无需” from”和” to”元素。

<set>元素仅需要”‘to”属性和适当的定时信息。

例子

<!DOCTYPE html>
<html>
<title>SVG Animation</title>
<body>
<svg height="450" width="450">

<rect x="50" y="40" width="60" height="60"
 style="fill: purple; fill-opacity: .4; stroke: black;">
<animate attributeName="width" attributeType="XML"
 begin="0s" dur="4s" from="60" to="0" fill="freeze"/>
<animate attributeName="height" attributeType="XML"
 begin="0s" dur="4s" from="60" to="0" fill="freeze"/>
</rect>

<text text-anchor="middle" x="60" y="60" style="visibility: hidden;">
<set attributeName="visibility" attributeType="CSS"
 to="visible" begin="4.5s" dur="1s" fill="freeze"/>
 All gone!

</text>
</svg>
</body>
</html>

立即测试

赞(0) 打赏
未经允许不得转载:srcmini » SVG设置元素用法示例
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏