function styleSelect(obj,func,classname) {

  // max items to show?
    var max = arguments[3];
    if( typeof max == 'undefined' )
      max = 0;

  // reference selctbox
    var selectBox   = $(obj);

  //  create menu div
    var menuDiv     = document.createElement('div');
    menuDiv.max = max;
    menuDiv.className = classname;
    menuDiv.onmouseover = function() {
      Element.show( this.lastChild );
    }
    menuDiv.onmouseout = function() {
      Element.hide( this.lastChild );
    }

  // create item container
    var menuItems   = document.createElement('div');
    menuItems.className = 'items';
    Element.hide( menuItems );
    menuItems.scroll = function() {
      if( this.scrolldir == 0 ) return;
      // determine first and last visible element
      var items = this.getElementsByTagName('div');
      var firstVisible = false;
      var lastVisible = false;
      var i = 1;
      while( i < items.length - 1  ) {
        if( items[i].style.display!='none' ) {
          lastVisible = i;
          if(!firstVisible)
            firstVisible = i;
        }
        i++;
      }
      // Do the actual scroll
      if( this.scrolldir > 0 ) {
        if( firstVisible > 1 ) {
          Element.hide( items[lastVisible]);
          Element.show( items[firstVisible-1]);
          lastVisible--;
          firstVisible--;
        }
      }
      else {
        if( lastVisible < items.length - 2 ) {
          Element.hide( items[firstVisible]);
          Element.show( items[lastVisible+1]);
          lastVisible++;
          firstVisible++;
        }
      }
      // (de)activate scrollers
      if( firstVisible == 1 ) {
        Element.addClassName( this.firstChild, 'disabled' );
        Element.removeClassName( this.lastChild, 'disabled' );
      } 
      else if ( lastVisible == items.length - 2 ) {
        Element.addClassName( this.lastChild, 'disabled' );
        Element.removeClassName( this.firstChild, 'disabled' );
      }
      else {
        Element.removeClassName( this.firstChild, 'disabled' );
        Element.removeClassName( this.lastChild, 'disabled' );
      }
      var element = this;
      setTimeout( 
        function() {
          element.scroll();
        },
        120
      );
    }
    menuDiv.appendChild( menuItems );
    

  // find options        
    var optionList  = $A( selectBox.options );

  // set default header text
    var headerText = optionList.first().text;

  // iterate through options
    var i = 0;
    optionList.each(
      function( item ) {
        // if it is selected, set the header text to this items text
        if( item.selected ) {
          headerText = item.text;
        }
        else {
          // create a div for each option
            menuItems.appendChild( document.createElement('div') );
            menuItems.lastChild.className = 'item';
          // hide if needed
          if( i >= max && max != 0 )
            Element.hide( menuItems.lastChild );
  
          // add a link to this div
            menuItems.lastChild.appendChild( document.createElement('A') );
          // set the text
            menuItems.lastChild.lastChild.innerHTML = item.text;
          // set a dummy href
            menuItems.lastChild.lastChild.href='#';
          // set an optionvalue propertie for the click handler
            menuItems.lastChild.lastChild.optionvalue = item.value;
          // add a click handler
            var text = item.text;
            var value = item.value;
            menuItems.lastChild.lastChild.onclick = function() {
              func(text,value);
            }
        }
        i++;
      }
    );
  // add a header
  menuDiv.insertBefore(document.createElement('div'),menuDiv.firstChild);
  menuDiv.firstChild.innerHTML = headerText;
  menuDiv.firstChild.className = 'header';

  // if there are more options than should be shown
  if( max && optionList.length > max ) {
    // add scroll up
    var scrollUp = document.createElement( 'div' );
    scrollUp.className = 'scrollup disabled';
    scrollUp.onmousedown = function() {
      this.parentNode.scrolldir = 1;
      this.parentNode.scroll();
    }
    scrollUp.onmouseup = function () {
      this.parentNode.scrolldir = 0;
    }
    menuItems.insertBefore( scrollUp, menuItems.firstChild );

    // add scroll down
    var scrollDown = document.createElement( 'div' );
    scrollDown.className = 'scrolldown';
    scrollDown.onmousedown = function() {
      this.parentNode.scrolldir = -1;
      this.parentNode.scroll();
      //this.parentNode.scroll(-1);
    }
    scrollDown.onmouseup = function () {
      this.parentNode.scrolldir = 0;
    }
    menuItems.appendChild( scrollDown );
  }

  // put the menu in the tree instead of the selectbox
  selectBox.parentNode.replaceChild(menuDiv,selectBox);
}         

