Active state in the wrong button
<p>I am editing a site that the menu is using a JavaScript. I managed to have it working but the hover state is just showing in the wrong place.</p>

<p><a href="http://ryansemple.com" rel="nofollow">Here is the link.</a> If you click on "Gallery" it's the Media that gets highlighted so on the last 3 menu items. Help please.</p>

<p>Here is the JavaScript code:</p>

<pre><code>$(document).ready(function(){
$('#menu .container').each(function(i){
    if(i==0)
    {
        var m = 1;  
    }
    else
    {
        var m = 2;
    }
    $(this).css('width',((m-1)*$(this).parent('li').height() + $(this).parent('li').width())).css('height',$(this).parent('li').height()).css('margin-left',-(m-1)*$(this).parent('li').height()).css('cursor','pointer');

    if(cur_page!=i)
    {
        $(this).find('.slide').html('&lt;img src="' + tpl_base + '/images/menu-slide-' + (i+1) + '.png" /&gt;').css('top',$(this).parent('li').height()).css('left',-/*m**/($(this).parent('li').height()));
    }
    else
    {
        $(this).find('.slide').html('&lt;img src="' + tpl_base + '/images/menu-slide-' + (i+1) + '.png" /&gt;').css('top','0px').css('left','0px');
    }

    $(this).find('.text').html('&lt;img src="' + tpl_base + '/images/menu-title-' + (i+1) + '.png" /&gt;').css('margin-left',(m-1)*$(this).parent('li').height());

    switch(i)
    {
        case 0: var a = url_base + '/bio';
            break;
        case 1: var a = url_base + '/blog';
            break;
        case 2: var a = url_base + '/gallery';
            break;
        case 3: var a = url_base + '/media';
            break;
        case 4: var a = url_base + '/contact';
            break;
        default: var a = url_base;
    }

    $(this).click(function(){
        window.location = a;                       
    });


    var t = $(this).parent('li').height();
    if(cur_page!=i)
    {
        $(this).hover(function(){
            $(this).find('.slide').stop().animate({top:'0px',left:/*-(t*(m-1))*/0 + 'px'}, 200)                    
        },function(){
            $(this).find('.slide').stop().animate({top:t + 'px',left:-(t/**m*/) + 'px'}, 400)                      
        });
    }
});
});
</code></pre>
