首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >@ GaussianBlur关键帧(svg)

@ GaussianBlur关键帧(svg)
EN

Stack Overflow用户
提问于 2016-10-18 21:19:41
回答 1查看 427关注 0票数 0

我正在创建基于GaussianBlur (属性"stdDeviation")的动画,在标签"animate“中一切正常,但我正在尝试使用css动画。而且它不起作用。动画的工作版本:

代码语言:javascript
复制
<filter id="f2" width="250%" height="250%">
<feOffset result="offOut" in="SourceGraphic" dx=".5" dy=".5" />
<feGaussianBlur result="blurOut" in="offOut" stdDeviation="3" id="gauss">
<animate attributeName="stdDeviation" attributeType="XML" dur="2s" values="1 ;  1.5 ; 2 ; 2.5 ; 3 ; 2.5 ; 2 ; 1.5 ; 1 " keyTimes="0 ; .13 ; .26 ; .39 ; .52; .65 ; .78; .9; 1" repeatCount="indefinite"/>
</feGaussianBlur>
<feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
</filter>

@关键帧,它们不起作用:

代码语言:javascript
复制
#gauss {
    -webkit-animation: gauss_keys 3s ease-out forwards infinite;
    animation: gauss_keys 3s ease-out forwards infinite;}
@keyframes gauss_keys {
    0% {
        stdDeviation: 0;
    }
    100% {
        stdDeviation: 2;
    }}
EN

回答 1

Stack Overflow用户

发布于 2016-10-19 13:09:04

stdDeviation不是CSS属性,无法使用CSS动画进行动画处理。您必须使用SMIL或JavaScript。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/40109440

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档