https://www.cockpit.co.jp/shop/assets/js/framework_rw.js

1/**
2 * framework_rw.js
3 * （RWD版用）
4 */
5
6
7/* !stack ------------------------------------------------------------------- */
8jQuery(document).ready(function($) {
9	dropdownMenu();
10	pagetop();
11});
12
13
14/* !dropdownMenu
15--------------------------------------------------- */
16var dropdownMenu = function(){
17	// framework.jsで設定されたイベントをクリア
18	$(window).off('.load_default');
19
20	// イベントハンドラ設定
21	$(window).on('load', function() { change_by_device(); })
22	$(window).on('orientationchange', function() { change_by_device(); })
23	var rTimer = null;
24	$(window).on('resize', function() {
25		if(rTimer != null ) {
26			clearTimeout(rTimer);
27		}
28		rTimer = setTimeout(function() {
29			change_by_device();
30		}, 100);
31	})
32	
33	// PC・SP振り分け処理
34	var deviceFlg;
35	var change_by_device = function() {		
36	
37		var appVersion = window.navigator.appVersion.toLowerCase();
38		// PCサイズまたはIE8の場合
39		if( $(document).width() >= 980 || appVersion.indexOf('msie 8.')!=-1) {
40			if(	deviceFlg != 1 ) {
41				reset_event();
42				$('#dropMenuWrap_sp').show();
43				dropdownMenu_pc();
44				deviceFlg = 1;
45			}
46		// TBサイズ以下の場合
47		} else {
48			if(	deviceFlg != 0 ) {
49				reset_event();
50				dropdownMenu_sp();
51				deviceFlg = 0;
52			}
53		}	
54	}
55	
56	// PC用にメニューの挙動を定義
57	var dropdownMenu_pc = function() {
58		// Gナビクリック
59		$('#gNavi ul li').on('click.pc_gNavi_click', function() {
60			var dutation = 500;
61			if($(this).hasClass('noDrop')) {
62				location.href = $(this).children('a').attr('href');
63			}
64			// 開いているメニューがない場合 → メニュー開く（スライドダウン）
65			else if( $('#gNavi ul li.active').size() == 0 ) {			
66				$(this).addClass('active');
67				var id = $(this).attr('id').replace('gNav', '');
68				$('#dropMenu > li').fadeTo(1, 0).hide();
69				$('#dropMenu #menu'+id).show().fadeTo(dutation, 1);
70				$('#dropMenu').slideDown('fast');
71				
72			// 開いているメニューがある場合
73			} else {
74				// 開いているメニューがクリックされた場合 → メニュー閉じる（スライドアップ）
75				if( $(this).hasClass('active') ) {
76					$('#gNavi ul li').removeClass('active');
77					$('#dropMenu').slideUp('fast');
78					
79				// 他のメニューがクリックされた場合 → コンテンツのみ切替
80				} else {
81					$('#gNavi ul li').removeClass('active');
82					$(this).addClass('active');
83					
84					var id = $(this).attr('id').replace('gNav', '');
85					$('#dropMenu > li').fadeTo(1, 0).hide();
86					$('#dropMenu #menu'+id).show().fadeTo(dutation, 1);
87				}
88			}
89				
90			return false;
91		});
92		
93		// 閉じるボタンまたはヘッダ以外クリック → メニュー閉じる（スライドアップ）
94		$('.dropMenuHeader01 .close, body > *:not(#header)').on('click.pc_close_click', function() {
95			$('#gNavi ul li').removeClass('active');
96			$('#dropMenu').slideUp('fast');
97		});
98	}
99		
100	// SP用にメニューの挙動を定義
101	var dropdownMenu_sp = function() {
102		// メニュー閉じておく
103		$('#headerMenuBtn').removeClass('open');
104
105		// メニューボタンタップ
106		$('#headerMenuBtn').on('click.sp_btn_click', function() {
107			// 開いているとき → メニュー閉じる（スライドアップ）
108			if( $(this).hasClass('open')) {
109				$('#dropMenuWrap_sp').slideUp('fast', function() {
110					$('#headerSearch').removeClass('show');					
111				});
112				$(this).removeClass('open');
113
114			// 閉じているとき → メニュー開く（スライドダウン）
115			} else {
116				$('#headerSearch').addClass('show');
117				$('#dropMenuWrap_sp').addClass('open').slideDown('fast');
118				$(this).addClass('open');
119			}
120		});
121		
122		// ヘッダ以外タップ → メニュー閉じる（即時）
123		$('body > *:not(#header)').on('click.sp_menuclose', function() {
124			// メニューが開いている場合
125			if( $('#headerMenuBtn').hasClass('open') ) {
126				$('#headerMenuBtn').removeClass('open');
127				$('#dropMenuWrap_sp').slideUp('fast', function() {
128					$('#headerSearch').removeClass('show');					
129				});
130				return false;
131			}
132		});
133	 }
134	 
135	// イベントハンドラを削除
136	var reset_event = function() {
137		$('#gNavi ul li').off('click.pc_gNavi_click');
138		$('.dropMenuHeader01 .close').off('click.pc_close_click');
139		$('#gNavi ul li').removeClass('active');
140		$('#dropMenu').hide();
141		$('body > *:not(#header)').off('click.pc_menuclose');
142		$('#headerMenuBtn').off('click.sp_btn_click');
143		$('body > *:not(#header)').off('click.sp_menuclose');
144		$('#headerMenuBtn').removeClass('open');
145		$('#dropMenuWrap_sp').removeClass('open').hide();
146		$('#headerSearch').removeClass('show');
147	}
148};
149/* !pagetop
150--------------------------------------------------- */
151var pagetop = function() {
152
153	$(window).on('load scroll resize orientationchange', function() {
154		// PC以外の場合
155		if( $(document).width() < 980 ) {
156			$('.pageTop').hide();
157		
158		// PCの場合
159		} else {
160			if( $(window).scrollTop() > 100) {
161				$('.pageTop').fadeIn();			
162			} else {
163				$('.pageTop').fadeOut();
164			}
165		}
166	});	
167};