// JavaScript Document


function chaimg(){
	var tb = document.getElementById('t_b');
	var rb = document.getElementById('r_b');
	var kb = document.getElementById('k_b');
 
 var tbb = tb.getAttribute("src");
	var rbb = rb.getAttribute("src");
	var kbb = kb.getAttribute("src");

	var hit = 1;
 
 tb.onclick = function(){
 	tb.setAttribute("src","index/topic_b.gif");
	rb.setAttribute("src","index/renkei_h.gif");
	kb.setAttribute("src","index/kousin_b_h.gif");
	

	hit = 1;
 }
 
rb.onclick = function(){
 	tb.setAttribute("src","index/topic_b_h.gif");
	rb.setAttribute("src","index/renkei.gif");
	kb.setAttribute("src","index/kousin_b_h.gif");

	hit = 2;
 }
 
 kb.onclick = function(){
 	tb.setAttribute("src","index/topic_b_h.gif");
	rb.setAttribute("src","index/renkei_h.gif");
	kb.setAttribute("src","index/kousin_b.gif");

	hit = 3;
 }
 
 


tb.onmouseover = function(){
	tb.setAttribute("src","index/topic_b.gif");
}

rb.onmouseover = function(){
	rb.setAttribute("src","index/renkei.gif");
}

kb.onmouseover = function(){
	kb.setAttribute("src","index/kousin_b.gif");
}




tb.onmouseout = function(){
	
	if(hit!=1){
		tb.setAttribute("src","index/topic_b_h.gif");
	}
}

rb.onmouseout = function(){
	
	if(hit!=2){
		rb.setAttribute("src","index/renkei_h.gif");
	}
}

kb.onmouseout = function(){
	
	if(hit!=3){
		kb.setAttribute("src","index/kousin_b_h.gif");
	}
}



 
 }
 



/*--setup--*/
window.onload=function() {
tab.setup = {
   tabs: document.getElementById('tab').getElementsByTagName('li'),
   pages: [
      document.getElementById('topics'),
      document.getElementById('renkei'),
      document.getElementById('kousin')
   ]
   
}
tab.init();

chaimg();

}
/*--setup end--*/
  
var tab = {
   init: function(){
      var tabs = this.setup.tabs;
      var pages = this.setup.pages;
  
      for(i=0; i<pages.length; i++) {
         if(i !== 0) pages[i].style.display = 'none';
         tabs[i].onclick = function(){ 
		 	tab.showpage(this); return false;
		};
      }
   },
  
   showpage: function(obj){
      var tabs = this.setup.tabs;
      var pages = this.setup.pages;
      var num;
  
      for(num=0; num<tabs.length; num++) {
         if(tabs[num] === obj) break;
      }
  
      for(var i=0; i<pages.length; i++) {
         if(i == num) {
            pages[num].style.display = 'block';
            tabs[num].className = 'selected';
			
         }
         else{
            pages[i].style.display = 'none';
            tabs[i].className = null;
         }
      }
   }
}