function FruityNav(selTabIndex) {
  
  ///////////////////////////////// CONFIG ///////////////////////////////////////
  
  // base path (WITH trailing slash) - you need to set this is pages are not all in the same folder
  this.basePath = '';
  
  // the id of the main nav div, please.
  this.navId = 'nav';
  
  // the id of the subnav, please.
  this.subnavId = 'subnav';
  
  // regular tabs
  this.regTabs = new Array();
  this.regTabs[this.regTabs.length] = 'images/shared/home-off-trans.png';
  this.regTabs[this.regTabs.length] = 'images/shared/netties-off-trans.png';
  this.regTabs[this.regTabs.length] = 'images/shared/goodies-off-trans.png';
  this.regTabs[this.regTabs.length] = 'images/shared/shop-off-trans.png';
  
  // hover states
  this.hoverTabs = new Array();
  this.hoverTabs[this.hoverTabs.length] = 'images/shared/home-on-trans.png';
  this.hoverTabs[this.hoverTabs.length] = 'images/shared/netties-on-trans.png';
  this.hoverTabs[this.hoverTabs.length] = 'images/shared/goodies-on-trans.png';
  this.hoverTabs[this.hoverTabs.length] = 'images/shared/shop-on-trans.png';
  
  // subnav
  this.subnavContents = new Array();
  this.subnavContents[this.subnavContents.length] = 'Welcome!';
  this.subnavContents[this.subnavContents.length] = 'Know them all!';
  this.subnavContents[this.subnavContents.length] = '<a href="goodies_wallpapers.php">Wallpapers</a> | <a href="goodies_folder_icons.php">Folder icons</a>';
  this.subnavContents[this.subnavContents.length] = 'Collect them all, impress your friends!';
  
  ////////////////////////////////////////////////////////////////////////////////
  
  this.selTabIndex = selTabIndex;
  
  // add base path
  for (var i=0; i<this.regTabs.length; i++) {
    this.regTabs[i] = this.basePath + this.regTabs[i];
  }
  for (var i=0; i<this.hoverTabs.length; i++) {
    this.hoverTabs[i] = this.basePath + this.hoverTabs[i];
  }
  

  
  // reset tabs to original state
  this.resetTabs = function() {
    if ($(this.navId) == null) {
      return false; 
    }
    var images = $(this.navId).getElementsByTagName('img');
    for (var i=0; i<this.regTabs.length; i++) {
      for (var j=0; j<images.length; j++) {
        if (images[j].src == this.hoverTabs[i]) images[j].src = this.regTabs[i];
      }
    }
  }
  
  // swap subnav content
  this.swapContent = function(tabIndex) {
    var subnav = $(this.subnavId);
    subnav.innerHTML = '';
    subnav.style.display = 'none';
    var images = $(this.navId).getElementsByTagName('img');
    Element.extend(images[tabIndex]);
    subnav.innerHTML = this.subnavContents[tabIndex];
    subnav.style.left = images[tabIndex].cumulativeOffset()[0] - (subnav.getWidth()/2) + (images[tabIndex].getWidth()/2) + 'px';
    new Effect.Appear(subnav, {duration: 0.4});
  }
  
  this.selectTab = function(tabIndex) {
    this.resetTabs();
    var images = $(this.navId).getElementsByTagName('img');
    for (var i=0; i<images.length; i++) {
      if (images[i].src == this.regTabs[tabIndex]) images[i].src = this.hoverTabs[i];
    }
    this.swapContent(tabIndex);
  };
  
  this.restoreCurrent = function() {
    this.resetTabs();
    this.selectTab(this.selTabIndex);
  };
  
  // init
  this.restoreCurrent();
  
  // preload hover states
  this.preload = function(i) {
    if (this.hoverTabs[i]) {
      var img = new Image();
      img.src = this.hoverTabs[i];
    } else {
      return false;
    }
  }
  
  var i=0;
  
  while (this.preload(i)) {
    alert('image ' + this.hoverTabs[i] + ' loaded.');
    i++;
  }
  
  // initialize
  this.restoreCurrent();

}