/* トランジション時間(ms) */
var MENU_FX_TIME = 1000;

/* トランジション用不透明度の開始、終了値 */
var MENU_OPACITY_MAX = 0.4;
var MENU_OPACITY_MIN = 0.001; /* 何故か 0 では不具合あり */

/* メニュー背景画像 */
var MENU_MOUSEOVER_IMG = "/images/img-menu_hover.gif";

/* メニューコントロールオブジェクト */
var MenuControl = {

	/* startファンクション */
	start: function(){

		/* トランジション用オブジェクト配列初期化 */
		var MenuFX = [];

		/* MENUのリスト数を取得 */
		var menu = document.getElements('.menu');

		/* MENUのリスト数でループ */
		for (var i=0 ; i<menu.length ; i++) {
			/* 図のID名を変数にセット */
			var divname = 'menu' + (i + 1);

			/* 図のID名からトランジション用オブジェクト作成         */
			/* また、図のindexに配列の添え字を格納(イベント内で使用) */
			MenuFX[i] = new Fx.Styles(divname, {wait: false, duration: MENU_FX_TIME,transition: Fx.Transitions.Quart.easeOut});
			$(divname).index = i; // イベント内で配列を特定するための添え字を保存

			/* とりあえず図はフェードアウトしておく */
			$(divname).effect('opacity', {duration: MENU_FX_TIME, transition:Fx.Transitions.linear}).start(MENU_OPACITY_MIN);

			/* メニュー背景画像設定(html上にはspacer.gifを配置してあり、それを置き換えます(JavaScriptOFF対策)) */
			$(divname).src = MENU_MOUSEOVER_IMG;

			/* マウスオーバーイベントハンドラ設定 */
			$(divname).addEvent('mouseover', function() {

				/* フェードイン */
				MenuFX[this.index].stop();
				MenuFX[this.index].start({ 'opacity': MENU_OPACITY_MAX });

				/* 任意のメニューをフェードインしたタイミングで、その他を強制フェードアウト(Safari & IE6用) */
				if (navigator.userAgent.match("Safari/(\\d+(\\.\\d+)*)")
				//|| navigator.userAgent.match("MSIE") && document.appendChild
				){
					for (var i=0 ; i<menu.length ; i++) {
						if (i != this.index) {
							MenuFX[i].start({ 'opacity': MENU_OPACITY_MIN });
						}
					}
				}
			});

			/* マウスアウトイベントハンドラ設定 */
			$(divname).addEvent('mouseout', function() {
			
				/* フェードアウト */
				MenuFX[this.index].stop();
				MenuFX[this.index].start({ 'opacity': MENU_OPACITY_MIN });
			});

		}

	}
}

/* ドキュメントのロードで発動 */
window.addEvent('load', MenuControl.start);