https://shinguu.jp/_en/js/script.js

1/* ===================================================================
2
3 * PC向けメニュー
4
5=================================================================== */
6$(function($) {
7	// 読み込み時処理
8	navFix();
9	// スクロール時処理
10	$(window).on('scroll', function() {
11		navFix();
12	});
13
14	// ナビゲーション固定
15	function navFix() {
16		var headerH = $('header').outerHeight(true);
17		if ($(this).scrollTop() > headerH) {
18			$('nav').addClass('fixed');
19		} else {
20			$('nav').removeClass('fixed');
21		}
22	}
23});
24
25
26/* ===================================================================
27
28 * PC/スマホ向けメニュー切り替え
29
30=================================================================== */
31$(function($){
32	var timer = false;
33	var windowWidth = window.innerWidth || document.documentElement.clientWidth || 0;
34	var nowWidth;
35
36	// 読み込み時処理
37	$(window).on('load', function(){
38		headerHight();
39		spMenu();
40		subNav();
41		summay();
42	});
43
44	// リサイズ時処理
45	$(window).on('resize', function(){
46		if (timer !== false) {
47			clearTimeout(timer);
48		}
49		timer = setTimeout(function() {
50			nowWidth = window.innerWidth || document.documentElement.clientWidth || 0;
51			if ( windowWidth != nowWidth ) {
52				headerHight();
53				subNav();
54				summay();
55				windowWidth = window.innerWidth || document.documentElement.clientWidth || 0;
56			}
57		}, 200);
58	});
59
60	// ヘッダー分の余白取得（スマートフォンのみ）
61	function headerHight() {
62		if ($('#spMenu').css('display') == 'block') {
63			var headerH = $('header').outerHeight(true);
64			$('body').css({'margin-top' : headerH});
65		}else {
66			$('body').css({'margin-top' : 0});
67		}
68	}
69
70	// メニューボタンの表示（
71	function spMenu() {
72		$('#spMenu').on('click', function(e) {
73			$('.gnav').slideToggle(e);
74			$('#navBtnIcon').toggleClass('close');
75			$('html, body').toggleClass('lock');
76		});
77	}
78
79	// サブメニューの表示
80	function subNav() {
81		if ($('#spMenu').css('display') == 'block') {
82			$('.subnav > a').off().on('click', function(e) {
83				e.preventDefault();
84				$(this).parent().find('ul').slideToggle();
85				$(this).parent().toggleClass('active');
86			});
87		} else {
88			if('ontouchstart' in document) {
89				$('.subnav > a').off().on('click', function(e) {
90					e.preventDefault();
91					$(this).parent().toggleClass('showNav');
92					$(this).parent().find('li').toggleClass('showSub');
93
94				});
95			} else {
96				$('.subnav').hover(function(){
97					$(this).find('li').addClass('showSub');
98				}, function(){
99					$(this).find('li').removeClass('showSub');
100				});
101			}
102		}
103	}
104
105	// 要約部分の非表示
106	function summay() {
107		if ($('#spMenu').css('display') == 'block') {
108			var position = 50; // 非表示位置
109			var $element = $('.summary');
110			if ($(window).scrollTop() > position){
111				$element.hide();
112			}
113			$(window).on('scroll', function(){
114				if ($(this).scrollTop() >= position) {
115					$element.not(':animated').hide();
116				} else {
117					$element.not(':animated').show();
118				}
119				headerHight();
120			});
121		}
122	}
123});
124
125/* ===================================================================
126
127 * ページ内リンク
128
129=================================================================== */
130$(function($){
131	var timer = false;
132	$(window).on('load', function(){
133		if (timer !== false) {
134			clearTimeout(timer);
135		}
136		timer = setTimeout(function() {
137			innerLink();
138			innerLinkMenu();
139		}, 300);
140	});
141
142	function innerLink() {
143		var easing = 'swing'; // 動作パターン
144		var speed = 500;      // スクロールの速度
145		var marginTop = 10;   // スクロール位置の変更
146
147		var url = $(location).attr('href');
148		if(url.indexOf('?id=') != -1){
149			var id = url.split('?id=');
150			var target = $('#' + id[id.length - 1]);
151			if(target.length){
152				// スマートフォン向け内部リンク
153				if($('#spMenu').css('display') == 'block') {
154					var fixEle = $('header');
155					var fixHeight = fixEle.outerHeight(true);
156					if($('.summary').css('display') == 'block') {
157						var position = target.offset().top- fixHeight -marginTop;
158					}
159				// PC向け内部リンク
160				} else {
161					var fixEle = $('nav');
162					var fixHeight = fixEle.outerHeight(true);
163					if($('nav').css('position') == 'fixed') {
164						var position = target.offset().top - fixHeight - marginTop;
165					} else {
166						var position = target.offset().top - fixHeight - fixHeight - marginTop;
167					}
168				}
169				$('html, body').animate({scrollTop:position}, speed, easing);
170			}
171		}
172	}
173
174	function innerLinkMenu() {
175		// メニューの表示・非表示
176		$('.gnav a[href^="#"]').on('click', function(e) {
177			if($('#spMenu').css('display') == 'block') {
178				$('.gnav').slideToggle(e);
179				$('#navBtnIcon').toggleClass('close');
180				$('html, body').toggleClass('lock');
181			}
182		
183		});
184	}
185	function innerLinkMenu() {
186		// メニューの表示・非表示
187
188		$('#normal a[href^="#"]').on('click', function(e) {
189			if($('.sp-langu').css('display') == 'block') {
190				$('#normal li ul').slideToggle(e);
191				$('#normal li ul').toggleClass('close');
192			}
193		
194		});
195	}
196	
197});
198
199
200