真的没有办法使用CSS为渐变背景设置动画吗?
就像是:
@-webkit-keyframes pulse { 0% { background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(196,222,242)), color-stop(0.5, rgb(242,242,242)), color-stop(1, rgb(240,240,240))); } 50% { background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(222,252,255)), color-stop(0.5, rgb(242,242,242)), color-stop(1, rgb(240,240,240))); } 100% { background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(196,222,242)), color-stop(0.5, rgb(242,242,242)), color-stop(1, rgb(240,240,240))); } }
我知道,对于Safari 5.1+和Chrome 10+,有一个新的渐变语法,但是现在,对于该项目,我必须坚持使用旧的语法。
Webkit渐变尚不支持过渡。它已在规格中,但尚无法使用。
(ps,如果您仅执行颜色转换-您可能要签出-webkit-filters-可以进行动画处理!)
更新:渐变过渡显然可以在IE10 +中使用