(function()
{
	// ロールオーバー、セレクテッド指定を行う CSS クラス名称／ファイル名を定めます。
	var _rolloverClass = 'rollover',
		_selectedClass = 'selected',
		_rolloverName = '_rollover',
		_selectedName = '_rollover';// 'selected'

	// ウインドウがロードされた時点で処理を開始します。
	addEvent(window, 'load', onRollOverStartUp);

	// 最初に行う処理です。
	function onRollOverStartUp()
	{
		scanSpecificTag('img');
		scanSpecificTag('input');
	}

	// 引数として受け取ったタグを走査しながら、イベントとその振る舞いを付与していきます。
	function scanSpecificTag(tagName)
	{
		var imgs = document.getElementsByTagName(tagName), imgsLength = imgs.length;

		for ( var i = 0; i < imgsLength; i++)
		{
			var classNames = imgs[i].className.split(" ").sort(),
				classNamesLength = classNames.length,
				isRollover = false,
				isSelected = false;

			for ( var j = 0; j < classNamesLength; j++)
				if (classNames[j].indexOf(_rolloverClass) != -1)
					isRollover = true;
				else
					if (isRollover && classNames[j].indexOf(_selectedClass) != -1)
						isSelected = true;

			if (isRollover)
				setEventToImage(imgs[i], isSelected);
		}
	}

	// startUp メソッドで指定された画像にイベント処理を追加します。
	function setEventToImage(element, isSelected)
	{
		// ロールオーバー時、クリック時の画像URLを取得します。
		element.originalSrc = element.src;
		element.originalSrc.match(/(^.{8,})\.(.+?$)/);
		element.hoverSrc = RegExp.$1 + _rolloverName + '.' + RegExp.$2;
		element.selectedSrc = RegExp.$1 + _selectedName + '.' + RegExp.$2;

		// 画像をプリロードします。
		var preloadImage = new Image(),
			target;

		preloadImage.src = element.hoverSrc;
		preloadImage.src = element.SelectedSrc;

		// selected クラスが指定されていた場合は、その画像を selected 状態のものに差し替えます。
		if (isSelected)
			element.src = element.originalSrc = element.selectedSrc;

		// マウスオーバー時のイベント処理方法を定めます。
		addEvent(element, 'mouseover', function(event)
		{
			target = event.target || event.srcElement;
			target.src = target.hoverSrc;
		});

		// マウスアウト時のイベント処理方法を定めます。
		addEvent(element, 'mouseout', function(event)
		{
			target = event.target || event.srcElement;
			target.src = target.originalSrc;
		});

		// マウスダウン時のイベント処理方法を定めます。
		if (_rolloverName != _selectedName)
			addEvent(element, 'mousedown', function(event)
			{
				target = event.target || event.srcElement;
				target.src = target.selectedSrc;
			});
	}

	// DOM要素にイベントを付与します。
	function addEvent(node, event, handler)
	{
		try
		{
			if (node.addEventListener)
				node.addEventListener(event, handler, false);
			else
				node.attachEvent('on' + event, handler);
		}
		catch (e)
		{
		}
	};
})();

