var tabEvents = {

  tabs : [],
  blocks : [],
 
  init: function() {
  	tabEvents.tabs[0] = document.getElementById('tab1');
  	tabEvents.tabs[1] = document.getElementById('tab2');
  	tabEvents.blocks[0] = document.getElementById('block1');
  	tabEvents.blocks[1] = document.getElementById('block2'); 
    for(var i=0, tabCount = tabEvents.tabs.length; i< tabCount; i++) {
       tabEvents.tabs[i].number = i;
       tabEvents.addEvent(tabEvents.tabs[i], 'click', tabEvents.showTabContent);
       tabEvents.addEvent(tabEvents.tabs[i], 'mouseover', tabEvents.highlightTab); 
       tabEvents.addEvent(tabEvents.tabs[i], 'mouseout', tabEvents.unhighlightTab);    
    }  
  },
  
  showTabContent : function() {
  	for(var j=0; j< tabEvents.tabs.length; j++) {
    	if (j == this.number) {
     		tabEvents.tabs[j].className = "active";
     		tabEvents.blocks[j].className = "on";
      	}
      	else {
        tabEvents.tabs[j].className = "";
      	tabEvents.blocks[j].className = "off";
      	}     
    }
  },
  
  highlightTab : function() {
  	if (this.className != "active"){
  		this.className = "hover";
  	}
  },

  unhighlightTab : function() {
  	if (this.className != "active"){
	  	this.className = "";
	}
  },


  // utility function for adding events
  addEvent : function(obj, type, func) {
    if (obj.addEventListener) {obj.addEventListener(type, func, false);}
    else if (obj.attachEvent) {
      obj["e" + type + func] = func;
      obj[type + func] = function() {obj["e" + type + func] (window.event);}
      obj.attachEvent("on" + type, obj[type + func]);
    }
    else {obj["on" + type] = func;}
  }

}



tabEvents.addEvent(window, 'load', tabEvents.init);