/* ----------
指定したIDを持つdivブロックに、以下のイベントを定義します。
イベントを指定したいdivブロックのidを、var MenuBlkIDs = new Array() 部分に配列で複数定義して下さい。
  ・マウスオーバーしたとき、class属性に『自分自身のid＋"hover"』を付け足す
  ・マウスアウトしたとき、class属性を元に戻す
     ⇒ CSSの設定により :hover と同等の効果が得られます。
  ・（ブロック内にリンクが含まれるときは）クリックしたとき、リンク先へ移動
     ⇒ ブロック全体がリンクのようになります。
     ※ ジャンプ先はブロック内にある一番初めのリンク先になります。
---------- */

if (window.addEventListener) { window.addEventListener("load", BlkHoverDefine, false); }
else if (window.attachEvent) { window.attachEvent("onload", BlkHoverDefine); }


function BlkHoverDefine(){
  if (!document.getElementsByTagName) return false;
  if (!document.getElementById) return false;

  var TargetZoneIDName = "maincolumn";	// 対象が含まれるブロックのid（に含まれる文字列）
  //var MenuBlkIDs = new Array("discount","ltdexpress","homeproduct");	// 対象ブロックのidを配列で指定
  var MenuBlkIDs = new Array("s_express","lowprice","qualitygoods");

  // 指定した文字を含むidを持つdivがあるかどうか調べる（適応対象を限定する）
  var TargetZoneElem      = document.getElementsByTagName("div");
  var TargetZoneElemCount = TargetZoneElem.length;
  for (var i=0; i<TargetZoneElemCount; i++){
       if (TargetZoneElem[i].getAttribute("id").indexOf(TargetZoneIDName) != -1) {
           var TargetBlk = document.getElementById(TargetZoneElem[i].getAttribute("id"));
           var flag = true; break;	// 見つかった時点でフラグを立ててループを抜ける（始めに見つかったブロックに限定）
       }
  }
  if (!flag) return false;	// 見つからなかったらfalseを返す

  // 見つかった適応対象に含まれる、指定したidを持つdivブロックへイベント定義
  var MenuBlks      = TargetBlk.getElementsByTagName("div");
  var MenuBlksCount = MenuBlks.length;
  if (MenuBlksCount == 0) return false;	// 適応対象ブロック内にdivが見つからない場合はfalseを返す

  for (var Targets=0; Targets<MenuBlkIDs.length; Targets++){	// 指定したidの個数分だけ繰り返し
       for (var i=0; i<MenuBlksCount; i++){	// 適応対象ブロック内のdiv数分だけ繰り返し
            if (MenuBlks[i].getAttribute("id") == MenuBlkIDs[Targets]) {	// 指定したidと一致した時のみ
                var InsideLinks      = MenuBlks[i].getElementsByTagName("a");	// 領域内のリンク
                var InsideLinksCount = InsideLinks.length;
                MenuBlks[i].oldClassName = MenuBlks[i].className;
                MenuBlks[i].onmouseover  = function() {
                    addClass(this,this.getAttribute("id") + "hover");
                };
                MenuBlks[i].onmouseout   = function() {
                    this.className = this.oldClassName;
                };
                if (InsideLinksCount != 0) {	// 領域内にリンクが含まれる場合
                    MenuBlks[i].onclick  = function() {
                        var LinkAnchors = this.getElementsByTagName("a");
                        //alert("リンク先：" + LinkAnchors[0].getAttribute("href"));return false;
                        location.href = LinkAnchors[0].getAttribute("href");
                    };
                };
            };	// if MenuBlks[i].getAttribute("id") == MenuBlkIDs[Targets]) end
       };	// for (var i=0; i<MenuBlksCount; i++) end
  }	// for (var Targets=0; Targets<MenuBlkIDs.length; Targets++) end
}	// function BlkHoverDefine() end


// 指定した要素に指定したclassを追加
function addClass(element,value) {
  if (!element.className) {
      element.className = value;
  } else {
      newClassName = element.className;
      newClassName += " ";
      newClassName += value;
      element.className = newClassName;
  }
}