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動畫徑向漸變？

回答

相關問題