I have just taken a simple image and trying to animate it. It is working fine in google chrome, but image is not showing in case of firefox. Here, I am giving you js fiddle link.
<body><div class="icon"></div></body>
Rest of the code is given in link: http://jsfiddle.net/vvkkumar06/tA7qw/
the answer in the MDN docs.
http://oli.jp/2010/css-animatable-properties/#background-image
background-image
This is still a little up in the air, with “only gradients” in the current Working Draft, no background-image at all in the current Editor’s Draft, and “Animatable: no” for background-image in CSS Backgrounds and Borders Module Level 3 Editor’s Draft. However, support has appeared in Chrome 19 Canary, and this is something that designers want. Until widespread support arrives this can be faked via image sprites and background-position or opacity.'
At this time I have found that nobody actually supports gradients (Chrome 17, FF 12, IE9). Only Chrome supports background-image (that's why it doesn't work in FF for me).
To Animate Background
Try this
