Simple Pulldown menu with scripty2.js

S2.UI.PulldownMenu = Class.create(S2.UI.Menu, {
  initialize: function($super, element, options) {
    $super(options);
    this.parent = $(element);
    this.parent.insert(this.element);

    var iLayout = this.parent.getLayout();   
    this.element.setStyle({
      left: iLayout.get('left') + 'px',
      top:  (iLayout.get('top') + iLayout.get('margin-box-height')) + 'px',
      zIndex: 1000000000,
      width: 'auto'
    });
    this.parent.observe('mouseenter', this._openMenu.bind(this));
    this.parent.observe('mouseleave', this._closeMenu.bind(this));
    this.element.observe('ui:menu:selected', this._selectMenu.bind(this));
  },
  
  addChoice:function($super, choice, url) {
    return  $super(choice).writeAttribute('url', url);
  },
  
  _openMenu: function(event) {
    this.open();
    event.stop();
  },
  
  _closeMenu: function(event) {
    if (this.isOpen()) {
      this.close();
      event.stop();
    }
  },
  
  _selectMenu: function(event) {
    document.location.href = event.memo.element.readAttribute('url');
  }
});

Usage.js

var menu = new S2.UI.PulldownMenu('menu_element');
menu.addChoice("Google", "http://www.google.com");
menu.addChoice("Prototype", "http://www.prototypejs.org");
menu.addChoice("Ruby On Rails", "http://www.rubyonrails.org");

// you can see a screenshot here: http://xilinus.com/pulldown.png