​x
 
1
<!DOCTYPE html>
2
<title>Example</title>
3
<style>
4
.animatedBox {
5
  width: 300px;
6
  height: 200px;
7
  text-align: center;
8
  font: 24px sans-serif;
9
  color: white;
10
  text-shadow: 0px 0px 12px black;
11
  background-image: url('/pix/samples/16l.jpg');
12
  background-position: bottom left;
13
  border: 1px solid black;
14
  animation: moveBg 10s ease 1s 2 alternate none;
15
}
16
​
17
@keyframes moveBg {
18
    100% {
19
      background-position: bottom right;
20
    }
21
}
22
</style>
23
​
24
<div class="animatedBox">Animated box</div>