SVG动画丢弃元素

问题描述

帮我弄清楚。 “丢弃”无效。圆圈应该在2秒后消失

  <!DOCTYPE html>
        <html>
            <head> 
                <meta charset="UTF-8"> 
                <title>discard</title> 
            </head>
        <body>
            <svg width="800" height="600">
                <circle id="circle2" cx="400" cy="300" r="100" fill="none" 
                    stroke="green" stroke-width="70" stroke-dasharray="15 15">
                    <animateTransform attributeName="transform" type="rotate"
                    begin="1s" dur="10s" from="0 400 300" to="-720 400 300"/>
                    <discard begin="2s"/> 
                </circle>   
            </svg>
        </body> 
    </html>

解决方法

您可以使用<set begin="2s" attributeName="visibility" to="hidden"/>而不是<discard begin="2s"/>隐藏圆圈。它实际上并没有丢弃圆,但是具有更广泛的兼容性。

<!DOCTYPE html>
        <html>
            <head> 
                <meta charset="UTF-8"> 
                <title>discard</title> 
            </head>
        <body>
            <svg width="800" height="600">
                <circle id="circle2" cx="400" cy="300" r="100" fill="none" 
                    stroke="green" stroke-width="70" stroke-dasharray="15 15">
                    <animateTransform attributeName="transform" type="rotate"
                    begin="1s" dur="10s" from="0 400 300" to="-720 400 300"/>
                    <set begin="2s" attributeName="visibility" to="hidden"/>
                </circle>   
            </svg>
        </body> 
    </html>

相关问答

依赖报错 idea导入项目后依赖报错,解决方案:https://blog....
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
错误1:gradle项目控制台输出为乱码 # 解决方案:https://bl...
错误还原:在查询的过程中,传入的workType为0时,该条件不起...
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct...