CSS, CSS3, Images | Type: CSSSliding Image Background

Cool effect if you have a good enough reason and a wide enough image.

HTML
<div class="wrapper">
<div class="sliding-background"> </div>
</div>

CSS
.wrapper {
   overflow: hidden;
}
.sliding-background {
   background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/9632/sliding-background-wwf.jpg") repeat-x;
   height: 560px; //height of the canvas
   width: 5076px; //min. 3x width of image
   animation: slide 60s linear infinite;
}
@keyframes slide{
   0%{
      transform: translate3d(0, 0, 0);
   }
   100%{
      transform: translate3d(-1692px, 0, 0); //image is 1602 pixels wide x 500 pixels high
   }
}