title: JS/CSS Animation Speed Relative to Object Size
body: <p>I have a JS function which animates the <code>height</code> of a <code>div</code> at a speed of <code>0.5 seconds</code>. This <code>height</code> value is <strong>dynamically defined</strong> upon content load, and it can be anywhere from <code>200px</code> to <code>6000px</code> or more.</p>
  
  <p>The problem I'm having is that when the <code>height</code> is larger than <code>800px</code> my default speed value of <code>0.5 seconds</code> makes the animation happen way too fast. And if I increase the default speed value to, say <code>2 seconds</code>, the animation gets too slow when the div is under <code>800px</code> tall.</p>
  
  <p>How can I make the animation speed relative to the div height so the animation feels the same regardless of the height value?</p>
  
  <p>I've tried this: <a href="https://stackoverflow.com/questions/10600775/calculate-coefficient-to-get-normal-speed-animation">Calculate coefficient to get normal speed animation</a>
  . But I get the following error:
  <code>ReferenceError: Can't find variable: TimeSpan</code></p>
  
  <p>I'd appreciate it if anyone has any ideas - Thanks in advance</p>