How to use an array of static variables?
<p>This is a bit awkward but I need an array of static variables.  Each time a function is called I need access to these variables.  Basically I have an effects functions that is "controlled" by a single variable currently called elapsed_time.</p>

<p>However, I need an elapsed_time for each element that is passed to the function so I can make sure not to run effects on the same element...(for my fade function this causes a flickering effect).</p>

<p>I would like to use the <code>element.id</code> to name my variables.</p>

<p>I just read a post saying that associative arrays are not really associative arrays and that you should not use them <a href="http://www.mennovanslooten.nl/blog/post/54" rel="nofollow">here.</a></p>

<p>Below is my current function that I need to update.</p>

<pre><code>/**
 *    Effects
 */

var Effects = function( element ) 
{
    this.element = element;
};

Effects.prototype.fade = function( direction, max_time ) 
{
    Effects.elapsed = 0;
/*
    Effects.arrayHold = [];
    Effects.arrayHold.push( this.element.id );
*/
    var persist_element = this.element;
    function next() 
    {
        Effects.elapsed += 10;
        if ( direction === 'up' )
        {
            persist_element.style.opacity = Effects.elapsed / max_time;
        }
        else if ( direction === 'down' )
        {
            persist_element.style.opacity = ( max_time - Effects.elapsed ) / max_time;
        }
        if ( Effects.elapsed &lt;= max_time ) 
        {
            setTimeout( next, 10 );
        }
    }
    next();
    return true;
};
</code></pre>
