title: Animate background position using gsap
body: <p>I have big svg picture which describes environment, and trying to create loop, moving picture left to right:</p>
  
  <p>html:</p>
  
  <pre><code>&lt;div class="animation-wrapper" id="scroller" style="position:absolute"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css:</p>
  
  <pre><code>.animation-wrapper{
      top: -0;
      left: -10000px;
      width: 100%;
      height: 100%;
      @include background-cover("../pictures/animation-background.svg");
      background-position: -10000px 0;
      margin: 0 auto;
  }
  </code></pre>
  
  <p>jsap:</p>
  
  <pre><code>var tl = new TimelineMax({repeat:-1});
  
      headerBackgroundContainer = jQuery(".animation-wrapper");
  
      function backgroundMoveInitiate()
      {
        tl.to(headerBackgroundContainer, 40, {background_position: 0, ease:Linear.easeNone});
      }
  
      backgroundMoveInitiate();
  </code></pre>
  
  <p>There is no javascript errors, but nothing happens at all. i am new in gsap, please tell me what's wrong here?</p>