https://www.y-yokohama.com/js/rn_common.js/

1
2var naviStop = 80;
3var viewportPoint = 769;
4var mode;
5var currentWidth;
6var currentHeight;
7
8
9$(window).on("load resize scroll", function() {
10	widthChk();
11});
12
13$(window).on("load resize", function() {
14	footerPopup();
15	stdModal();
16	stdModal02();
17	stdAccordion();
18	tiresizeinfoAccordion();
19});
20
21
22
23//ウィンドウサイズを監視して PC SP フラッグを付与
24function widthChk(){
25	currentWidth = window.innerWidth;
26	if(currentWidth < viewportPoint){
27		mode = "sp";
28		var header_h = $(".header-common").outerHeight();
29		$("body").css("padding-top",header_h);
30	}else if(currentWidth >= viewportPoint){
31		mode = "pc";
32		$("body").css("padding-top",0);
33	}
34}
35
36
37//汎用モーダル
38//ボタン要素　 ---> ".stdmodal-open"を付与
39//表示対象要素 ---> ".stdmodal"を付与
40//「".stdmodal-open"のtitle属性名」と「".stdmodal"のid属性名」を同じにすることで機能する
41function stdModal(){
42	if(mode == "pc"){
43		//SP時の要素をリセット
44		$(".panel-help-acc").slideUp();
45		$(".stdmodal-open").removeClass("acc-activ");
46		$("body").removeClass("body-stdmodal-activ");
47		
48		$(".stdmodal-open").off("click");
49		$(".stdmodal-open").on("click", function(){
50			var targetVal = $(this).attr("title");
51			var idName = "#"+targetVal;
52			$(idName).after("<div class='stdmodal-overlay'></div>");
53			$(".stdmodal-overlay").show();
54			$(idName).fadeIn(500);
55			$("body").addClass("body-stdmodal-activ");
56			return false;
57		});
58		$(".btn-close").on("click", function(){
59			$(".stdmodal").fadeOut();
60			$(".stdmodal-overlay").remove();
61			$("body").removeClass("body-stdmodal-activ");
62			return false;
63		});
64		$(document).on("click", ".stdmodal-overlay", function () {
65			$(this).remove();
66			$(".stdmodal").fadeOut();
67			$("body").removeClass("body-stdmodal-activ");
68			return false;
69		});
70	}else if(mode == "sp"){
71		//PC時の要素をリセット
72		$(".stdmodal-overlay").remove();
73		$(".stdmodal").hide();
74		$(".stdmodal-open").off("click");
75		$(".stdmodal-open").on("click", function(){
76			var targetVal = $(this).attr("title");
77			var idName = "#"+targetVal;
78			if($(idName).css("display") === "none"){
79				$(this).addClass("acc-activ");
80				$(idName).stop().slideDown();
81			}else{
82				$(this).removeClass("acc-activ");
83				$(idName).stop().slideUp();
84			}
85			return false;
86		});
87	}
88}
89
90
91//汎用モーダル02 PC/SP共に同じ挙動をします
92//ボタン要素　 ---> ".stdmodal02-open"を付与
93//表示対象要素 ---> ".stdmodal02"を付与
94//「".stdmodal02-open"のtitle属性名」と「".stdmodal02"のid属性名」を同じにすることで機能する
95function stdModal02(){
96	$(".stdmodal02-open").off("click");
97	$(".stdmodal02-open").on("click", function(){
98		var targetVal = $(this).attr("title");
99		var idName = "#"+targetVal;
100		//$(idName).after("<div class='stdmodal02-overlay'></div>");
101		var target = document.querySelector(idName = "#"+targetVal);
102		var newElement = document.createElement( 'div' ) ;
103		newElement.className = 'stdmodal02-overlay';
104		target.insertAdjacentElement("afterend", newElement);
105		$(".stdmodal02-overlay").show();
106		$(idName).fadeIn(500);
107		$("body").addClass("body-stdmodal02-activ");
108		return false;
109	});
110
111	$(".btn-close").on("click", function(){
112		$(".stdmodal02").fadeOut();
113		$(".stdmodal02-overlay").remove();
114		$("body").removeClass("body-stdmodal02-activ");
115		return false;
116	});
117}
118
119
120
121
122//ページ外スクロール
123$(function(){
124var urlHash = location.hash;
125if(urlHash) {
126    $('body,html').stop().scrollTop(0);
127    setTimeout(function(){
128        var target = $(urlHash);
129	  var hedC = $(".header-common").outerHeight();
130	  var gwNv = $(".global-wrapper--nav").outerHeight();
131	  var sclT = $(window).scrollTop();
132	  var adjust = 0;
133	  
134	  if(mode == "pc"){
135		  if(hedC < sclT){
136			  adjust = gwNv;
137		  }else{
138			  adjust = (gwNv/1.6) + hedC;
139		  }
140		}else if(mode == "sp"){
141				adjust = hedC;
142		}
143	  
144	  var position = target.offset().top-adjust;
145        $('body,html').stop().animate({scrollTop:position}, 500);
146    }, 100);
147}
148});
149
150//ページ内スクロール
151$(function(){
152	$('a[href^="#"]').click(function(){
153		if($(this).hasClass("md-link--anchor")){
154		  var speed = 500;
155		  var href= $(this).attr("href");
156		  var target = $(href == "#" || href == "" ? 'html' : href);
157		  
158		  var hedC = $(".header-common").outerHeight();
159		  var gwNv = $(".global-wrapper--nav").outerHeight();
160		  var sclT = $(window).scrollTop();
161		  var adjust = 0;
162		  
163		  if(mode == "pc"){
164			  if(hedC < sclT){
165				  adjust = gwNv;
166			  }else{
167				  adjust = (gwNv/1.6) + hedC;
168			  }
169			}else if(mode == "sp"){
170					adjust = hedC;
171			}
172		  
173		  var position = target.offset().top-adjust;
174		  $("html, body").animate({scrollTop:position}, speed);
175		  return false;
176	  }
177	});
178});
179//ページ内スクロール
180$(function(){
181	$('a[href^="#"]').click(function(){
182		if($(this).hasClass("anc-link")){
183		  var speed = 500;
184		  var href= $(this).attr("href");
185		  var target = $(href == "#" || href == "" ? 'html' : href);
186		  
187		  var hedC = $(".header-common").outerHeight();
188		  var gwNv = $(".global-wrapper--nav").outerHeight();
189		  var sclT = $(window).scrollTop();
190		  var adjust = 0;
191		  
192		  if(mode == "pc"){
193			  if(hedC < sclT){
194				  adjust = gwNv;
195			  }else{
196				  adjust = (gwNv/1.6) + hedC;
197			  }
198			}else if(mode == "sp"){
199					adjust = hedC;
200			}
201		  
202		  var position = target.offset().top-adjust;
203		  $("html, body").animate({scrollTop:position}, speed);
204		  return false;
205	  }
206	});
207});
208
209//ページ内スクロール（イメージマップ）
210$(function(){
211	$('area[href^="#"]').click(function(){
212		if($(this).hasClass("md-link--anchor")){
213		  var speed = 500;
214		  var href= $(this).attr("href");
215		  var target = $(href == "#" || href == "" ? 'html' : href);
216		  
217		  var hedC = $(".header-common").outerHeight();
218		  var gwNv = $(".global-wrapper--nav").outerHeight();
219		  var sclT = $(window).scrollTop();
220		  var adjust = 0;
221		  
222		  if(mode == "pc"){
223			  if(hedC < sclT){
224				  adjust = gwNv;
225			  }else{
226				  adjust = (gwNv/1.6) + hedC;
227			  }
228			}else if(mode == "sp"){
229					adjust = hedC;
230			}
231		  
232		  var position = target.offset().top-adjust;
233		  $("html, body").animate({scrollTop:position}, speed);
234		  return false;
235		}
236	});
237});
238

239function footerPopup(){
240	var popInr = $(".js-popup-inr").outerHeight();
241	var footerFN = $(".footer-fixnav").outerHeight();
242	var upH = 0;
243	var downH = 0;
244	if(mode == "pc"){
245		upH = 0;
246		downH = (popInr-48)*-1;
247	}else{
248		upH = footerFN;
249		downH = (popInr+footerFN)*-1;
250	}
251	$(".js-popup-inr").css("bottom", downH);
252	$(".popup-btn").removeClass("popup-activ");
253	
254	$(".popup-btn, .popup-header").off("click");
255	$(".popup-btn, .popup-header").on("click", function(){
256		if($(this).parents(".footer-popup").hasClass("std-search-nearshop")){
257			return false;
258		}
259		if($(".popup-btn").hasClass("popup-activ")){
260			$(".js-popup-inr").stop().animate({
261				"bottom": downH
262			});
263			$(".popup-btn").removeClass("popup-activ");
264			$(".js-popup-inr").removeClass("inr-activ");
265		}else{
266			$(".js-popup-inr").stop().animate({
267				"bottom": upH
268			});
269			$(".popup-btn").addClass("popup-activ");
270			$(".js-popup-inr").addClass("inr-activ");
271		}
272	});
273};
274
275
276//汎用アコーディオン
277//ボタン要素　 --->

277 ".std-acc-btn"を付与
278//ボタン要素　 ---> 任意のtitle属性を付与（例 title="acc-01"）
279//動作対象要素 ---> 上記のtitle属性と同名のクラスを付与（例 class="acc-01"）
280
281//状況に応じてボタン要素に .std-acc-btn-open がaddまたはremoveされます。
282//その他の挙動はCSSにて制御してください。
283function stdAccordion(){
284	$(".std-acc-btn").off("click");
285	$(".std-acc-btn").on("click", function(){
286		var targetVal = $(this).attr("title");
287		var className = "."+targetVal;
288		if($(this).hasClass("std-acc-btn-open")){
289			$(this).removeClass("std-acc-btn-open");
290			$(className).stop().slideUp();
291		}else{
292			$(this).addClass("std-acc-btn-open");
293			$(className).stop().slideDown();
294		}
295	});
296}
297
298
299
300function tiresizeinfoAccordion(){
301	var btn = $(".tiresizeinfo-panel-acc-btn");
302	var targetVal = $(btn).attr("title");
303	var className = "."+targetVal;
304	if(mode == "pc"){
305		$(className).show();
306		$(btn).removeClass("acc-btn-open");
307	}else if(mode == "sp"){
308		if($(btn).hasClass("acc-btn-open")){
309			return false;
310		}else{
311			$(className).hide();
312		}
313		$(btn).off("click");
314		$(btn).on("click", function(){
315			if($(this).hasClass("acc-btn-open")){
316				$(this).removeClass("acc-btn-open");
317				$(className).stop().slideUp();
318			}else{
319				$(this).addClass("acc-btn-open");
320				$(className).stop().slideDown();
321			}
322			return false;
323		});
324	}
325}
326
327//ページ下部、コーナーナビゲーション_現在地処理
328window.onload = (function(){
329	var url = window.location.pathname.toString();
330	url = url.indexOf('/') == 0 ? url : '/' + url;
331	var index = url.indexOf("#");
332	if (index > 0) {
333		url = url.substring(0, index);
334	}
335	$('.ln-23-item a[href="'+url+'"]').addClass('current');
336});
337