https://www.healthy-home.co.jp/column/wp-content/themes/monolith_tcd042/scripts/common.js

1// common.js
2/*
3Standards Compliant Rollover Script
4Author : Daniel Nolan
5http://www.bleedingego.co.uk/webdev.php
6*/
7var preLoadImg = new Object();
8function initRollOvers(){
9	jQuery("img.img_on").each(function(){
10		var imgSrc = this.src;
11		var sep = imgSrc.lastIndexOf('.');
12		var onSrc = imgSrc.substr(0, sep) + '_on' + imgSrc.substr(sep, 4);
13		preLoadImg[imgSrc] = new Image();
14		preLoadImg[imgSrc].src = onSrc;
15		jQuery(this).hover(
16			function() { this.src = onSrc; },
17			function() { this.src = imgSrc; }
18		);
19	});
20}
21// rolloverの実行
22$(function(){
23	initRollOvers();
24});
25
26// スムーススクロール
27$(function(){
28	$('a[href^=#]:not(.no_scroll)').click(function(){
29		var headerHight = 0; // 固定ヘッダの高さ
30		var speed = 500; // スクロールの速さ
31		var href= $(this).attr("href");
32		var target = $(href == "#" || href == "" ? 'html' : href);
33		var position = target.offset().top-headerHight;
34		$("html, body").animate({scrollTop:position}, speed, "swing");
35		return false;
36	});
37});
38
39// ユーザーエージェントチェック
40var agent = navigator.userAgent;
41
42var spFlag = false;
43if(agent.indexOf("iPhone") > 0){
44	// iphone処理
45	spFlag = true;
46}else if(agent.indexOf("Android") > 0){
47	// android処理
48	spFlag = true;
49}
50
51// 画像を枠いっぱいに表示させる
52function img_fill(){
53	if(sizeSp){
54		var imgFill = $('.imgFill, .imgFillSp');
55	}else{
56		var imgFill = $('.imgFill');
57		$('.imgFillSp').removeClass('imgFillH imgFillV');
58	}
59
60	imgFill.each(function() {
61		var $boxImg = $(this);
62		var boxWidth = $boxImg.outerWidth();
63		var boxHeight = $boxImg.outerHeight();
64		var boxRatio = boxHeight/boxWidth;
65		var imgWidth = $boxImg.find('img').width();
66		var imgHeight = $boxImg.find('img').height();
67		var imgRatio = imgHeight/imgWidth;
68		if(boxRatio>imgRatio){
69			$boxImg.addClass('imgFillH');
70		}else{
71			$boxImg.addClass('imgFillV');
72		}
73	});
74}
75$(window).load(function(){
76	img_fill();
77});
78
79
80// 電話リンクの削除
81$(function(){
82	if(!spFlag){
83		$("a[href^='tel:']").each(function(){
84
85			var replaceText = 'javascript:void(0);';
86			$(this).attr("href", replaceText);
87			$(this).css({"cursor": "default"});
88			//gtagがない場合(PC)
89			if(typeof gtag != 'function') {
90					 
91				var replaceText = 'javascript:void(0);';
92				$(this).attr("onclick", replaceText);
93			}
94			
95		});
96	}
97});
98
99$(function(){
100	//gtagがない場合(SP)
101	if(typeof gtag != 'function') {
102		$("a[href^='tel:']").each(function(){
103			 
104			var replaceText = 'javascript:void(0);';
105			$(this).attr("onclick", replaceText);
106		});
107	}
108	
109	
110});
111
112//============================================================
113//	レスポンシブ用(不要な場合は削除)
114//============================================================
115// 画面サイズ取得
116var window_default_w = jQuery(window).width();
117var breakpoint = 767;
118var sizeSp = false;
119if(window_default_w>breakpoint){
120	sizeSp = false;
121}else{
122	sizeSp = true;
123}
124
125// スマホ用画像切替え
126var preLoadImg_sp = new Object();
127function img_sp(){
128	jQuery("img.img_sp").each(function(){
129		var imgSrc = this.src.replace('_sp','');
130		var sep = imgSrc.lastIndexOf('.');
131		var onSrc = imgSrc.substr(0, sep) + '_sp' + imgSrc.substr(sep, 4);
132		preLoadImg_sp[imgSrc] = new Image();
133		preLoadImg_sp[imgSrc].src = onSrc;
134		if (sizeSp){
135			(this).src = onSrc;
136		}else{
137			(this).src = imgSrc;
138		}
139	});
140}
141
142// img_spを動作
143$(function(){
144	img_sp();
145});
146
147//リサイズ時の処理
148var resizeTimer;
149$(window).resize(function() {
150	clearTimeout(resizeTimer);
151	resizeTimer = setTimeout(function() {
152		var window_w = $(window).width();
153		if(window_w!=window_default_w){
154			img_sp();

155			if(window_w>breakpoint){
156				sizeSp = false;
157			}else{
158				sizeSp = true;
159			}
160		}
161    }, 200);
162});
163
164//============================================================
165//	サイト毎に共通動作を記述する場合はここより下で行うこと
166//============================================================
167// ウィンドウのスクロールの有効／無効
168var defaultPosition;
169var windowScrollTop;
170function windowScrollToggle(){
171	var target = $('#container');
172	if(target.css('position') == 'fixed') {
173		target.css({'position':defaultPosition,'top':'0'});
174		$('html,body').scrollTop(windowScrollTop);
175	} else {
176		defaultPosition = target.css('position');
177		windowScrollTop = $(window).scrollTop();
178		target.css({'position':'fixed','top':-windowScrollTop});
179	}
180}
181
182// pcNaviの表示／非表示
183$('#header .btnNavi , #pcNavi .btnClose').on('click',function(){
184	if(!sizeSp){
185		if($('#pcNavi').hasClass('naviOpen')){
186			$('#pcNavi').removeClass('naviOpen');
187			$('#pcNavi').slideUp(300);
188		}else{
189			$('#pcNavi').addClass('naviOpen');
190			$('#pcNavi').slideDown(300);
191		}
192	}
193});
194$(document).click(function(event) {
195	if(!$(event.target).closest('#header .btnNavi ,#pcNavi').length) {
196		$('#pcNavi').removeClass('naviOpen');
197		$('#pcNavi').slideUp(300);
198	}
199});
200
201// spNaviの表示／非表示
202$('#header .btnNavi , #spNavi .btnClose01, #spNavi .btnClose02').on('click',function(){
203	if(sizeSp){
204		$('#spNavi').toggleClass('naviOpen');
205		windowScrollToggle();
206	}
207});
208
209// イベント一覧の高さを揃える
210$(window).resize(function() {
211	var window_w = window.innerWidth;
212	if(window_w!=window_default_w){
213		hFitEventItem();
214	}
215});
216$(window).load(function(){
217	hFitEventItem();
218});
219function hFitEventItem(){
220	try {
221		if (sizeSp){
222			$('.secCmnEventList li .titEvent').tile(2);
223		}else{
224			$('.secCmnEventList li .titEvent').tile(3);
225		}
226	} catch(e){}
227}
228
229// スライダーを初期化（引数minSlidesSpは省略可能）
230function initSlider(elementName, settings ,minSlides, minSlidesSp){
231	// 初期化
232	var slider = new Swiper(elementName + ' .swiper-container', settings);
233	// スマホの場合、最小のスライド枚数を変更
234	if(minSlidesSp != undefined && $(window).width() <= breakpoint){
235		minSlides = minSlidesSp;
236	}
237	// 最小のスライド枚数以下の場合、disabledクラスを追加
238	if(getSliderCount(elementName) <= minSlides) {
239		$(elementName).addClass('disabled');
240	}
241	return slider;
242}
243
244// スライダーの枚数をカウント
245function getSliderCount(elementName){
246	return $(elementName + ' .swiper-slide:not(.swiper-slide-duplicate)').length;
247}
248
249// ループ指定のスライダーのLightboxが正しく動作するようにする
250function setSliderLightbox(elementName){
251	// 最初のスライドの前・最後のスライドの後に挿入されるクローンのLightboxを削除
252	$(elementName + ' .swiper-slide.swiper-slide-duplicate a').removeAttr('data-lightbox');
253	$(elementName + ' .swiper-slide.swiper-slide-duplicate a').attr('href','javascript:void(0)');
254	// クローンのLightboxをクリック
255	$(elementName + ' .swiper-slide.swiper-slide-duplicate a').on('click',function(){
256		// クローンではないスライドのLightboxを実行する
257		var index = $(this).closest('.swiper-slide').attr('data-swiper-slide-index');
258		$(elementName + ' .swiper-slide:not(.swiper-slide-duplicate):eq('+ index + ') a').trigger('click');
259	});
260}