ロールオーバー jQuery Plugin

jquery.rollover.js

////////////////////////////////////////////////////////////////////////////////
// Rollover - jQuery Plugin
// 識別子.拡張子で読込めた画像をロールオーバープラグイン
// 
// Copyright 2010, Minoru Nakanow
// Licensed under the MIT licenses.
// http://www.opensource.org/licenses/mit-license.html
// 
// Usage:
// $("img").rollover();
// 
// mouseout  <img src="example.png">
// mouseover <img src="example_on.png">
// 
////////////////////////////////////////////////////////////////////////////////
(function($) {
	//--------------------------------------------------------------------------
	//  jQuery extend 
	//--------------------------------------------------------------------------
	jQuery.fn.extend({
		/**
		 * Rollover
		 * 
		 * @param {String} suffix	ロールオーバー画像の識別子(初期値: "_on")
		 * @return {jQuery}
		 */
		rollover: function(suffix) {
			suffix = suffix || "_on";
			
			return this.each(function() {
				var self = this;
				var src = this.src;
				var hover = src.replace(/\.[^\.]+$/, suffix + "$&");
				if (/*@cc_on!@*/0) hover += "?"+ new Date().getTime();
				
				$(document.createElement("img"))
				.attr("src", hover)
				.one("load", function() {
					$(self).hover(
						function() { this.src = hover },
						function() { this.src = src }
					);
				});
			});
		}
	});
})(jQuery);