
/**
 * rollover.js
 * 
 * class="roll"が指定された要素はロールオーバー効果が適用される。
 * 中身のimgは_on付きのものに変わる。
 * class="rollgroup"が指定されていた場合は連動してロールオーバー効果がかかる
 * 
 * 設定例：
 * 別途dummy_on.jpgを同じフォルダに用意する
 * <img src="dummy.jpg" class="roll" /> 
 *
 * jquery-1.1.3.1.pack.js
 * init.js
 *   $j
 *   PAGELOCATE.preloader
 */
 
$j(function(){
	
	//class="btn"はロールオーバーを設定 (src属性を_on付きのものに差し替える) 
	$j('img.roll').each(function(){
		this.originalSrc = $j(this).attr('src');
		this.rolloverSrc = this.originalSrc.replace(/(\.gif|\.jpg|\.png)/, "_on$1");
		if(this.rolloverSrc.match(/(\cr_on.gif|\cr_on.jpg|\cr_on.png)/) == ""){
			PAGELOCATE.preloader.load(this.rolloverSrc);
		}
	});
	//通常ロールオーバー
	$j('img.roll').not($j('.rollgroup .roll, .current .roll')).hover(function(){
		$j(this).attr('src',this.rolloverSrc);
	},function(){
		$j(this).attr('src',this.originalSrc);
	});
	//グループ化されたロールオーバー
	$j('.rollgroup').hover(function(){
		$j(this).find('.roll').each(function(){
			$j(this).attr('src',this.rolloverSrc);
		});
	},function(){
		$j(this).find('.roll').each(function(){
			$j(this).attr('src',this.originalSrc);
		});
	});
	
});
