HTML CSS examples for CSS Animatable Property:background
Move/Animate A DIV Background Image Vertically
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> html, body { height: 100%; margin: 0; } .outer {<!--from w w w . ja va2 s. c o m--> height:100%; overflow: hidden; } .inner { height:200%; width:100%; -webkit-animation:mymove 5s linear infinite; /* Safari and Chrome */ animation:mymove 5s linear infinite; background-image: url('https://www.java2s.com/style/demo/Firefox.png'); background-size: 100% 50%; } @-webkit-keyframes mymove { from { background-position: 0% 0%; } to { background-position: 0% -100%; } } @keyframes mymove { from { background-position: 0% 0%; } to { background-position: 0% -100%; } } </style> </head> <body> <div class="outer"> <div class="inner"> this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test </div> </div> </body> </html>