title: JQuery Animate Jumpy Only in Safari
body: <p>I'm working on a page where I'd like to have a hiding left navigation bar. I'm running into the problem only with Safari, there are no issues in Chrome, FF, Opera, IE7+. </p>
  
  <p>When the sliding animation is about to complete in Safari you'll see some content briefly jump to its original position then disappear. I have been researching for a while without much luck. It seems like most of the time it's padding or margin, but they are set to zero and I've tried two CSS resets. It seems to me like it's something to do with the floats. I tried playing with Clear but no luck.</p>
  
  <p><a href="http://jsfiddle.net/eLvBr/6/" rel="nofollow noreferrer">Here is a demo</a></p>
  
  <p>And the relevant animation:</p>
  
  <pre><code>$('#btnHide').click(function() {
      $("#divNavContent").animate({
          width: 'toggle'
      }, 1000, function() {
          $("#divNavHidden").animate({
              width: 'toggle'
          }, 500);
      });
  
  });
  
  $('#btnShowMenu').click(function() {
      $("#divNavHidden").animate({
          width: 'toggle'
      }, 500, function() {
          $("#divNavContent").animate({
              width: 'toggle'
          }, 1000);
      });
  });  
  </code></pre>