https://cart.mirai-japan.co.jp/common/js/jquery/jquery.layerBoard.js

1/*
2 * ===================================================================
3 *	jquery.layerBoard.js
4 *	@auther:kiyoty
5 *	@URI:http://www.idea-clippin.com
6 *	@create:2012/12/30
7 * 	@License:MIT License(X11 License、X License)
8 * ===================================================================
9 *	
10 * -------------------------------------------------------------------
11 *	opition
12 * -------------------------------------------------------------------
13 * delayTime		//表示までの待ち時間
14 * fadeTime			//表示のフェード時間
15 * alpha				//レイヤーの透明度
16 * limitMin			//何分経過後に再度表示するか
17 * easing				//イージング
18 * limitCookie	//cookie保存期間
19 *	
20 * -------------------------------------------------------------------
21 *	Example
22 *	$('#layer_board_area').layerBoard({alpha:0.5});
23 * -------------------------------------------------------------------
24*/
25(function($) {
26  $.fn.layerBoard = function(option) {
27		var elements = this;
28		elements.each(function(){
29			option = $.extend({
30				delayTime: 200,						//表示までの待ち時間
31				fadeTime : 500,						//表示のフェード時間
32				alpha : 0.5,							//レイヤーの透明度
33				limitMin : 1,							//何分経過後に再度表示するか
34				easing: 'linear',					//イージング
35				limitCookie : 1	 					//cookie保存期間
36			}, option);
37			var limitSec = option.limitMin * 60; //秒数に変換
38			if ($.cookie('layerBoardTime') == null) {
39				/*----------------------------------------
40					cookieがない場合
41				 ----------------------------------------*/
42				LayerBoardFunc ();
43				//cookieに現在の時間をセット
44				var start = new Date();
45				$.cookie('layerBoardTime', start.getTime(), { expires: option.limitCookie,path: '/' });
46			} else {
47				/*----------------------------------------
48					cookieがある場合
49				 ----------------------------------------*/
50				//現在のミリ秒を取得し、秒数に変換
51				var now = new Date();
52				secDiff = now.getTime() - $.cookie('layerBoardTime');
53				secTime = Math.floor( secDiff / 1000);
54				//指定時間を経過していた場合は、LayerBoardを表示
55				//cookieを削除後、再度cookieに現在のミリ秒をセット
56				if (secTime >= limitSec) {
57					LayerBoardFunc ();
58					$.cookie('layerBoardTime', null, { expires:-1,path: '/' });
59					var start = new Date();
60					$.cookie('layerBoardTime', start.getTime(), { expires:option.limitCookie,path: '/' });
61				}
62			}
63			/*----------------------------------------
64				表示処理
65			 ----------------------------------------*/
66			function LayerBoardFunc () {
67				$('.layer_board_bg', elements).show().animate({opacity: 0},0).delay(option.delayTime).animate({opacity: option.alpha},option.fadeTime,function(){
68					$('.layer_board', elements).fadeIn(option.fadeTime);																																					
69				})
70			}
71			/*----------------------------------------
72				非表示処理
73			 ----------------------------------------*/
74			$('.layer_board_bg', elements).click(function() {
75				$('.layer_board', elements).fadeOut(option.fadeTime);
76				$(this).fadeOut(option.fadeTime);
77			});
78			//closeボタンの場合
79			$('.btn_close', elements).click(function() {
80				$('.layer_board', elements).fadeOut(option.fadeTime);
81				$('.layer_board_bg', elements).fadeOut(option.fadeTime);
82			});
83			/*----------------------------------------
84				ボタンによる表示処理
85			 ----------------------------------------*/
86			$('.layer_board_btn').click(function() {
87				$('.layer_board_bg', elements).show().animate({opacity: 0},0).delay(option.delayTime).animate({opacity: option.alpha},option.fadeTime,function(){
88					$('.layer_board', elements).fadeIn(option.fadeTime);																																					
89				});
90			});
91		});
92		return this;		
93	};
94})( jQuery );