Webkit动画径向渐变？

在this Fiddle，我试图在我的容器元素中获得“发光”效果。Webkit动画径向渐变？

#box { 
    width: 100px; 
    height: 100px; 
    margin: 10px; 
    animation: glow 2s ease-in-out infinite alternate; 
    -webkit-animation: glow 2s ease-in-out infinite alternate; 
} 
@keyframes glow { 
    from {background-image:radial-gradient(circle farthest-side at center, rgba(255,0,0,0) 24px, rgba(255,0,0,1) 24px, rgba(255,0,0,0) 24px);} 
    to {background-image:radial-gradient(circle farthest-side at center, rgba(255,0,0,0) 24px, rgba(255,0,0,1) 24px, rgba(255,0,0,0) 48px);} 
} 
@-webkit-keyframes glow { 
    from {background-image:-webkit-radial-gradient(center,circle farthest-side, rgba(255,0,0,0) 24px, rgba(255,0,0,1) 24px, rgba(255,0,0,0) 24px);} 
    to {background-image:-webkit-radial-gradient(center,circle farthest-side, rgba(255,0,0,0) 24px, rgba(255,0,0,1) 24px, rgba(255,0,0,0) 48px);} 
}

它在IE10中工作，但由于某种原因在Chrome中它只呈现“到”状态并且根本不动画。 Webkit中的渐变是否具有动画效果？

来源

2012-12-14 Niet the Dark Absol

经过进一步的检查，似乎background-image在Webkit中不是一个有生命力的属性，即使它是一个渐变。

这是一个耻辱，但至少它显示了一个静态辉光，所以我想这是一些东西。

来源

2012-12-19 05:37:23

Webkit动画径向渐变？

回答

相关问题