html 背景不是图片是动画,使用CSS3动画更改背景图像

为什么这不起作用？我究竟做错了什么？

的CSS

@-webkit-keyframes test {

0% {

background-image: url('frame-01.png');

}

20% {

background-image: url('frame-02.png');

}

40% {

background-image: url('frame-03.png');

}

60% {

background-image: url('frame-04.png');

}

80% {

background-image: url('frame-05.png');

}

100% {

background-image: url('frame-06.png');

}

}

div {

float: left;

width: 200px;

height: 200px;

-webkit-animation-name: test;

-webkit-animation-duration: 10s;

-webkit-animation-iteration-count: 2;

-webkit-animation-direction: alternate;

-webkit-animation-timing-function: linear;

}

演示

http://jsfiddle.net/hAGKv/

提前致谢！