/*
 * rollOver - jQuery Plugin
 *
 * Copyright (c) DESIGN inc. All Rights Reserved.
 * http://www.design-inc.jp/
 *
 */

(function($){
	$.fn.rollOver = function(options){
		
		var settings = $.extend({
			selectorFade: 'a.ro-fade img', //フェードクラス
			selectorReFade: 'a.ro-xfade img', //フェードクラス（通常時が半透明）
			selectorSwitch: 'a.ro-switch img', //画像切替クラス
			selectorFadeswith: 'a.ro-fswitch img', //フェード画像切替クラス
			attachStr: '-on', //ロールオーバー画像の名前
			animateTime: 300, //アニメーションの時間
			fadeOpacity: 0.7, //フェードのパーセンテージ
			easing: 'easeOutCubic' //イージング
		}, options);
		
		// フェード
		$(settings.selectorFade).each(function(){
			$(this).hover(function(){
				$(this).animate({opacity: settings.fadeOpacity}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			}, function(){
				$(this).animate({opacity: 1}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			});
		});
		
		// フェード（通常時が半透明）
		$(settings.selectorReFade).css({opacity: settings.fadeOpacity});
		$(settings.selectorReFade).each(function(){
			$(this).hover(function(){
				$(this).animate({opacity: 1}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			}, function(){
				$(this).animate({opacity: settings.fadeOpacity}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			});
		});
		
		// 画像切替
		$(settings.selectorSwitch).not('[src*="' + settings.attachStr + '."]').each(function(){
			this.overImg = new Image();
			this.overImg.src = $(this).attr('src').replace(new RegExp('(\.gif|\.jpg|\.png)$'), settings.attachStr + '$1');
			$(this.overImg).css({position: 'absolute', opacity: 0});
			$(this).before(this.overImg);
			$(this.overImg).hover(function(){
				$(this).css({opacity: 1});
			},
			function(){
				$(this).css({opacity: 0});
			});
		});
		
		// フェード画像切替
		$(settings.selectorFadeswith).not('[src*="' + settings.attachStr + '."]').each(function(){
			this.overImg = new Image();
			this.overImg.src = $(this).attr('src').replace(new RegExp('(\.gif|\.jpg|\.png)$'), settings.attachStr + '$1');
			$(this.overImg).css({position: 'absolute', opacity: 0});
			$(this).before(this.overImg);
			$(this.overImg).hover(function(){
				$(this).animate({opacity: 1}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			},
			function(){
				$(this).animate({opacity: 0}, {duration: settings.animateTime, easing: settings.easing, queue: false});
			});
		});
		
		return this;
	};
})(jQuery);
