Css animation on background image is not working in chrome

css, css-animations, google-chrome, html

Solution

You are forgetting `-webkit-animation: water 5000s linear infinite;` as well as `-webkit-animation: flow 5000s linear infinite;` for `webkit` as still, chrome requires them, you can check this out

Demo

#waterfall { 
  /* Other properties */
  -webkit-animation: flow 5000s linear infinite; /* <--- Here */
  animation: flow 3s forwards linear normal;
}

And

#water {
  /* Other properties */
  -webkit-animation: water 5000s linear infinite; /* <---- here */
  animation: water 5000s linear infinite;
}

Note: Just make sure you use `-moz-` as well...

Problem

Please tell transition/animation properties for chrome differs ? or Am I doing something wrong? : Fiddle ``` @-webkit-keyframes water { 0% {background-position: 0 0;} 100% {background-position: 100000% 0;} } @keyframes water { 0% {background-position: 0 0;} 100% {background-position: 100000% 0;} } ``` Solved : http://jsfiddle.net/aradhayaKansal/7cgkj/3/ ! thanks to Mr. Alien

Original source