var DropDownMenu = new Class({

 initialize: function(menuElement) {

  this.menu = menuElement;
  this.id = menuElement.id;
  this.duration = 400;
  this.buttons = [];


  $A(this.menu.getElementsByTagName('li')).each(
   function(li) {
    if(li.parentNode == menuElement) { this.buttons.push($(li)); }
   }.bind(this)
  );
  this.submenus = $A(this.menu.getElementsByTagName('ul'));

  this.submenus.each(
   function(submenu) {
    submenu = $(submenu);
    submenu.setStyle('display','');
    submenu.originalHeight = submenu.offsetHeight;
    submenu.effect = new Fx.Style(submenu, 'height',{ duration: this.duration, transition:Fx.Transitions.quartOut });
    submenu.effect.set(0);
   }.bind(this)
  );

  this.buttons.each(
   function(button) {
    button.addEvent('mouseover',this.expand.bindAsEventListener(this));
    button.addEvent('mouseout', this.collapse.bindAsEventListener(this));
   }.bind(this)
  );

 },

 findButton: function(element) {

  var button = false;
  while(element.parentNode) {
   if(this.buttons.test(element)) { button = element; }
   element = element.parentNode;
  }
  return button;
 },

 findSubmenu: function(element) {
  var button = this.findButton(element);
  var submenu = button.getElementsByTagName('ul')[0];
  return submenu;
 },

 expand: function(event) {
  var submenu = this.findSubmenu(event.target || event.srcElement);
  if(submenu) {
   submenu.effect.clearTimer();
   submenu.effect.start(submenu.originalHeight);
  }
 },

 collapse: function(event) {
  var submenu = this.findSubmenu(event.target || event.srcElement);
  if(submenu) {
   submenu.effect.clearTimer();
   submenu.effect.start(0);
  }
 }

});