title: JQuery UI resizable does not support position: fixed; Any recommendations?
body: <p>JQuery UI's <code>.resizable</code> function does not support <code>position: fixed;</code> elements. The moment you try to resize them it switches their position attribute to absolute. Any recommended fixes?</p>
  
  <p>I have some chat windows that pop up and are draggable around the document. They are position fixed so that they don't scroll with the page behind them. They all work perfectly until you try to resize a window, that's when it transitions to <code>position: absolute;</code> and then gets left behind when the page scrolls.</p>
  
  <p>I tried handling the resize stop event and changing the position to fixed:</p>
  
  <pre><code>    stop: function (event, ui)
      {
          $(chatWindow).css('position', 'fixed');
      }
  </code></pre>
  
  <p>This doesn't work because the positioning (<code>top:</code> and <code>left:</code>) are not correct for the fixed element and when you stop resizing the element switches to fixed positioning and jumps to weird places on the page. Sometimes jumps out of the page boundries and is lost forever.</p>
  
  <p>Any suggestions?</p>