jQueryで画像をロールオーバーする方法2

Javascript

jQueryを使って画像をロールオーバーする方法のclassなどを指定せず画像の名前だけで、ロールオーバーする方法です。

使用方法

使用方法はJSファイルを読み込んだ後、単純にロールオーバーしたい画像の名前の拡張子の前に「_off」をつけるだけです。そして ロールオーバーする画像は「_on」で用意しておきます。

$(document).ready(function() {
	$("img").each(function(){
	var offSrc = $(this).attr("src");
	var onSrc = offSrc.replace("_off.","_on.");
	$(this).hover(
		function() { $(this).attr("src",onSrc); }
		,function() { $(this).attr("src",offSrc); }
		);
	});
});