title: Jquery animate left is not working, what's wrong?
body: <p>I'm using jQuery's <code>animate()</code> and it just doesn't work. I'm trying to get a div to slide off another div that's containing it and has <code>overflow:hidden</code>. I've tried every combination of <code>left</code> on the animate and nothing. Just to make sure, I also tried changing the width of the div (gallery) and it does change the width, but not the left.</p>
  
  <p>What am I doing wrong?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function an() {
  
    //$('#gallery').fadeOut();
    //$('#gallery').animate({left:'-=1000'},'slow');
    $('#gallery').animate({
      'left': '+=100px'
    }, 'slow');
  
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div align="center" style="position:relative; height:137px; overflow:hidden; width:1000px; border:3px solid #ff0000;"&gt;
    &lt;div id="gallery" style="background-color:#033; width:100px; height:137px;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;a href="#" onclick="an(); return false;"&gt;test&lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><a href="http://jsfiddle.net/cLdRW/1/" rel="nofollow">View on JSFiddle</a></p>