//sliding tabs from http://exposed.egoism.jp/wordpress/?p=337
//現在のタブ、タブエリアのid名を保存するための変数
var currenttab_name = "tab-web";
var currentarea_name = "area-web";

////スクロール用関数
function Scroll(nextarea_name, clicktab_name){
	
	//tabの色をクリック時に変化
	var clicktab = document.getElementById(clicktab_name);
	clicktab.className = "tab-active";
	var currenttab = document.getElementById(currenttab_name);
	currenttab.className = "tab-noactive";
	currenttab_name = clicktab_name;
	
	////tabarea移動部分
	var anim = {time:0, start:0, change:750, duration:25}
	
	//現在のタブエリアのoffsetLeftを取得
	var currentarea = document.getElementById(currentarea_name);
	var currentarea_x = currentarea.offsetLeft;
	//それを、スタート地点に設定
	anim.start = currentarea_x;
	
	//移動するエリアのoffsetLeftを取得
	var nextarea = document.getElementById(nextarea_name);
	var nextarea_x = nextarea.offsetLeft;
	//差を移動させる値に設定
	anim.change = nextarea_x - currentarea_x;
	//移動後のエリア名を保存
	currentarea_name = nextarea_name;
	
	//タイマーで、エリアを単位ミリ秒毎に移動
	var timer = setInterval(scrollarea, 15);
	
	//移動する値を計算する関数
	//http://www.robertpenner.com/easing/で紹介されている模様
	function sineInOut(t, b, c, d){
		return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
	}
	
	//移動用関数
	function scrollarea(){
		if(anim.time >= anim.duration){
			clearInterval(timer);
		}
		var area = document.getElementById("tabcontent");
		area.scrollLeft = sineInOut(anim.time, anim.start, anim.change, anim.duration);
		anim.time = anim.time + 1;
	}
}