title: Animating the <body> background using CSS and skrollr.js
body: <p>I would like to animate the <code>background-position</code> CSS property of the <code>&lt;body&gt;</code> tag using <code>skrollr.js</code>. I want it to slightly move the background image up as the page scrolls to give it a little spice. However, using this...</p>
  
  <pre><code>data-0="background-position: 0px 0px;" data-1000="background-position: 0px -250px;"
  </code></pre>
  
  <p>...isn't working.</p>
  
  <p>I tried using a <code>&lt;div&gt;</code> to accomplish the feat (animating its <code>background-position</code>), but that doesn't give me the effect I am looking for. When I animate the <code>background-property</code> of the <code>&lt;div&gt;</code>, the <code>background-position</code> works correctly; but once the <code>&lt;div&gt;</code> scrolls out of sight, whatever is behind the <code>div</code> become visible, which I don't want. Any suggestions?</p>