title: Can't select input field during jQuery animate?
body: <p>This question is an indirect result of <a href="https://stackoverflow.com/q/8692240/1064923">this question</a> about a animation script for a form. </p>
  
  <p>It's just a simple jQuery script that animates a input field to a different width upon it being focused upon, and resets it to its original width upon defocusing like so:</p>
  
  <pre><code>$(document).ready(function() {
  $('input').focus(function() {
      $(this).animate({
          width: "250px"
      }, 500);
  });
  $('input').focusout(function() {
      $(this).animate({
          width: "200px"
      }, 500);
  });
  });
  </code></pre>
  
  <p>The problem is that during the 500 milliseconds the input is animating, it's impossible to select the contents of that input if there is any in there - it may seem like a minor issue, but it is extremely irritating, and detracts from the overall usability of the form it is part of.</p>
  
  <p>Is there any way around this? I couldn't find a single thing!</p>