/*
 * Assigns a function to ul elements with the class "mouseovermenu"  (which are
 * children of mouseovermenu-top)  to handle  mouseover and mouseout events. 
 * Unobstrusive-esque way.  Of course, you can change those names!
 *
 * Works with: Firefox 1.5.0.9 and Opera 9.01 and IE >.>
 * Author: Favio Manriquez <favio@favrik.com>
 * Date: 18 February 2007
 */
var moMenu = {
    version: '0.1',
    
    over: function(elm) {
        $(elm).style.backgroundColor = '#6D6D6D';
    },
    
    out:  function(elm) {
        $(elm).style.backgroundColor = '#B6B6B6';
    },
    
    setWidth: function(elm, w) {
        elm.style.width = w + 'px';
    }
};

/* Define lists width */
var moWidths = ['129', '129', '56', '129', '128'];
containers = $('mouseovermenu-top').getElementsByClassName('mouseovermenu');
containers.each( function(item, index) {
    item.onmouseover = moMenu.over.bind(moMenu, $(item));
    item.onmouseout  = moMenu.out.bind(moMenu, $(item));
    moMenu.setWidth(item, moWidths[index]);
});