window.onload = function()
{
// ロールオーバーさせる要素の取得
var imgOvers = _getElementByClassName('imgover','img');
var imgOverslength = imgOvers.length;
for(i=(imgOverslength-1);i>=0;i--)
{
// addEventListenerはIEでは使えない。
// IEはattachEventが有効
if(imgOvers[i].attachEvent)
{
imgOvers[i].attachEvent('onmouseover',_imgOn);
imgOvers[i].attachEvent('onmouseout',_imgOut);
}
else
{
imgOvers[i].addEventListener('mouseover',_imgOn);
imgOvers[i].addEventListener('mouseout',_imgOut);
}
}
// マウスオーバー時の動作
function _imgOn(e)
{
thisElem = _getThis(e);
thisElem.src = thisElem.src.replace(/(\.gif|\.jpg|\.png)/,'_on$1');
}
// マウスアウト時の動作
function _imgOut(e)
{
thisElem = _getThis(e);
thisElem.src = thisElem.src.replace(/(_on\.)/g,'\.');
}
/*
* _getElementByClassName
* 指定クラス名とタグ名を使ってほしい要素を取得する。
*
* @parm
* cName String クラス名
* tName String タブ名
*
* @return
* classNameArr Array 一致したクラス名たち
*
*/
function _getElementByClassName(cName,tName)
{
//タグ名で要素を取得
var tags = document.getElementsByTagName(tName);
var tagsLen = tags.length;
var classNameArr = new Array();
// 取得した要素をループで回す。
// このパターンのループはカウントダウンのほうが早い
for(i=(tagsLen-1);i>=0;i--)
{
// 指定したクラスがあれば配列に格納する。
if(tags[i].className == cName)
{
classNameArr.push(tags[i]);
}
}
return classNameArr;
}
/*
* _getThis
* thisの取得
*
* @parm
* eventData Object イベントオブジェクト
*
* @return
* 自分自身のオブジェクト
*
*/
function _getThis(eventData)
{
var e = (window.event)? window.event : arguments.callee.caller.arguments[0] ;
var self = e.target || e.srcElement;
return self;
}
}
© Company 2012