title: Changing width of an absolute positioned div
body: <p>I'm working on a slider. When a user moves the slider, I have a <code>div</code> that expands over another <code>div</code>. I do this by changing the <code>width</code> and <code>left</code> style attributes of the <code>div</code>. For example, when the page loads, the <code>div</code> looks like this:</p>
  
  <pre><code>&lt;div class="vr" style="left: 100%; width: 0%;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>When the user moves the slider, the <code>left</code> and <code>width</code> style attributes are dynamically changed so it will look something like this:</p>
  
  <pre><code>&lt;div class="vr" style="left: 85.1859753886784%; width: 14.8140246113216%;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>However, is there anyway to expand this <code>div</code> without changing the <code>width</code>, and only changing the <code>left</code> style attribute? For example, by keeping the <code>right</code> attribute alway at 0 and changing the <code>left</code> style attribute, can the <code>div</code> be expanded? E.g. something like:</p>
  
  <pre><code>&lt;div class="vr" style="left: 85.1859753886784%; right:0;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>From my experiments, it only expands if <code>width</code> is set as the user moves the slider...</p>