/*
 * マウスオーバー：hoge_rollover.(拡張子)
 * マウスアウト　：hoge_rollout.(拡張子)
 * 上記の画像は同一ディレクトリに格納する
 * 画像のクラス名をclass="fade"とする
 */
new function(){
	function setRollOver(){
		if(!document.images){return;}
		var imgs = document.images;
		var insert = [];
		for(var i=0;i<imgs.length;i++){
			
			// 画像のクラス名を取得
			var img_class = imgs[i].getAttribute("class");
			if(!img_class) {
				img_class = imgs[i].getAttribute("className");	// for IE
			}
			var splitname = imgs[i].src.split('_rollout.');
			if((splitname[1])&&(img_class=='fade')){
				var rolloverImg = document.createElement('img');
				rolloverImg.src = splitname[0]+'_rollover.'+splitname[1];
				var alpha = 0;
				rolloverImg.currentAlpha = alpha;
				rolloverImg.style.opacity = alpha/100;
				rolloverImg.style.filter = 'alpha(opacity='+alpha+')';
				rolloverImg.style.position = 'absolute';
				
				// Safari対応
				var uName = navigator.userAgent;
				if (uName.indexOf("Safari") > -1) {
					rolloverImg.style.margin = '0px 0px 0px 10px';
				}

				// 画像のid値を取得
				var img_id = imgs[i].getAttribute("id");
				if(!img_id) {
					img_id = imgs[i].getAttribute("idName");	// for IE
				}
				
				// LIのid値を取得
			//	var li_ids = img_id.split('_');
			//	var li_id = li_ids[1]+'_'+li_ids[2];
			//	var li_obj = document.getElementById(li_id);

				//ロールオーバー・アウト処理それぞれを設定
				addEvent(rolloverImg,'mouseover',function(){setFader(this,100);});
				addEvent(rolloverImg,'mouseout',function(){setFader(this,0);});

				// 後で追加するために追加場所と共に保存しておく
				// この時点で追加するとdocument.imagesが書き換わって不都合
				insert[insert.length] = {position:imgs[i],element:rolloverImg};
			}
		}
		// ↑で作ったロールオーバー画像を追加
		for(var i=0;i<insert.length;i++){
			var parent = insert[i].position.parentNode;
			parent.insertBefore(insert[i].element,insert[i].position);
		}
	}

	// 指定要素を指定透明度にするためのフェードアニメを設定する関数

	function setFader(targetObj,targetAlpha){
		targetObj.targetAlpha = targetAlpha;
		if(targetObj.currentAlpha==undefined){
			targetObj.currentAlpha = 100;
		}
		if(targetObj.currentAlpha==targetObj.targetAlpha){
			return;
		}
		if(!targetObj.fading){
			if(!targetObj.fader){	// 関数が定義されているか？
				targetObj.fader = fader;
			}
			targetObj.fading = true;
			targetObj.fader();
		}
	}

	// アルファ値をターゲット値に近づける関数
	// ターゲット値になったら終了

	function fader(){
		this.currentAlpha += (this.targetAlpha - this.currentAlpha)*0.3;
		if(Math.abs(this.currentAlpha-this.targetAlpha)<1){
			this.currentAlpha = this.targetAlpha;
			this.fading = false;
		}
		var alpha = parseInt(this.currentAlpha);
		this.style.opacity = alpha/100;
		this.style.filter = 'alpha(opacity='+alpha+')';
		if(this.fading){
			var scope = this;
			setTimeout(function(){fader.apply(scope)},30);
		}
	}

	// イベントを追加する関数

	function addEvent(eventTarget, eventName, func){
		if(eventTarget.addEventListener){
			// モダンブラウザ
			eventTarget.addEventListener(eventName, func, false);
		}else if(window.attachEvent){
			// IE
			eventTarget.attachEvent('on'+eventName, function(){func.apply(eventTarget);});
		}
	}

	addEvent(window,'load',setRollOver);

}

