https://hakatad-c.com/wp-content/themes/is-hakata/js/infiniteslidev2.js?ver=1785977769

1/*
2infiniteslide.js v2
3version: 2.0.1
4Author: T.Morimoto
5
6Copyright 2017, T.Morimoto
7* Free to use and abuse under the MIT license.
8* http://www.opensource.org/licenses/mit-license.php
9
10https://github.com/woodroots/infiniteslidev2
11*/
12
13(function($){
14	$(window).on('load', function() {
15	    window.loaded = true;
16	});
17	$(function(){
18		$.fn.infiniteslide = function(options){
19			//option
20			var settings = $.extend({
21				'speed': 100, //速さ　単位はpx/秒です。
22				'direction': 'left', //up/down/left/rightから選択
23				'pauseonhover': true, //マウスオーバーでストップ
24				'responsive': false, //子要素の幅を%で指定しているとき
25				'clone': 1
26			},options);
27
28			var setCss = function(obj,direction){
29				$(obj).wrap('<div class="infiniteslide_wrap"></div>').parent().css({
30					overflow: 'hidden'
31				});
32
33				if(direction == 'up' || direction == 'down'){
34					var d = 'column';
35				} else {
36					var d = 'row';
37				}
38
39				$(obj).css({
40					display: 'flex',
41					flexWrap: 'nowrap',
42					alignItems: 'center',
43					'-ms-flex-align': 'center',
44					flexDirection: d
45				}).children().css({
46						flex: 'none',
47						display: 'block'
48					});
49			}
50
51			var setClone = function(obj,clone){
52				var $clone = $(obj).children().clone().addClass('infiniteslide_clone');
53				i = 1;
54				while(i <= clone){
55					$clone.clone().appendTo($(obj));
56					i++;
57				}
58			}
59
60			var getWidth = function(obj){
61				w = 0;
62				$(obj).children(':not(.infiniteslide_clone)').each(function(key,value){
63					w = w + $(this).outerWidth(true);
64				});
65				return w;
66			}
67			var getHeight = function(obj){
68				h = 0;
69				$(obj).children(':not(.infiniteslide_clone)').each(function(key,value){
70					h = h + $(this).outerHeight(true);
71				});
72				return h;
73			}
74
75
76			var getSpeed = function(l,s){
77				return l / s;
78			}
79			var getNum = function(obj,direction){
80				if(direction == 'up' || direction == 'down'){
81					var num = getHeight(obj);
82				} else {
83					var num = getWidth(obj);
84				}
85				return num;
86			}
87
88			var getTranslate = function(num,direction){
89				if(direction == 'up' || direction == 'down'){
90					var i = '0,-' + num + 'px,0';
91				}else {
92					var i = '-' + num + 'px,0,0';
93				}
94				return i;
95			}
96
97			var setAnim = function(obj,id,direction,speed){
98				var num = getNum(obj,direction);
99				if(direction == 'up' || direction == 'down'){
100					$(obj).parent('.infiniteslide_wrap').css({
101						height: num + 'px'
102					});
103				}
104				var i = getTranslate(num,direction);
105
106				$(obj).attr('data-style','infiniteslide' + id);
107
108				var css = '@keyframes infiniteslide' + id + '{' +
109								'from {transform:translate3d(0,0,0);}' +
110								'to {transform:translate3d(' + i + ');}' +
111							'}';
112				if(direction == 'left'){
113					css = '@keyframes infiniteslide' + id + '{' +
114								'from {transform:translate3d(' + i + ');}' +
115								'to {transform:translate3d(0,0,0);}' +
116							'}';
117				}
118
119				$('<style />').attr('id','infiniteslide' + id + '_style')
120				.html(css)
121				.appendTo('head');
122
123				if(direction == 'right' || direction == 'down' || direction == 'left'){
124					var reverse = ' reverse';
125				} else {
126					var reverse = '';
127				}
128
129				$(obj).css({
130					animation: 'infiniteslide' + id + ' ' + getSpeed(num,speed) + 's linear 0s infinite' + reverse
131				});
132			}
133			var setStop = function(obj){
134				$(obj).on('mouseenter',function(){
135					$(this).css({
136						animationPlayState: 'paused'
137					});
138				}).on('mouseleave',function(){
139					$(this).css({
140						animationPlayState: 'running'
141					});
142				});
143			}
144
145			var setResponsive = function(obj,direction){
146					var num = getNum(obj,direction);
147					var i = getTranslate(num,direction);
148					return i;
149				};
150
151
152
153
154			return this.each(function(key,value){
155				var $this = $(this);
156				var num = Date.now() + Math.floor(10000*Math.random()).toString(16);
157				if(settings.pauseonhover == true){
158					setStop($this);
159				}
160				var _onload = function(){
161					setCss($this,settings.direction);
162					setClone($this,settings.clone);
163					setAnim($this,num,settings.direction,settings.speed);
164
165					if(settings.responsive){
166						$(window).on('resize',function(){
167							setTimeout(function(){
168								var i = setResponsive($this,settings.direction);
169								var styleid = $this.attr('data-style');
170								var stylehtml = $('#' + styleid + '_style').html();
171
172								var stylehtml_new;
173								if(settings.direction == 'left'){
174									stylehtml_new = stylehtml.replace(/from {transform:translate3d\((.*?)\)/,'from {transform:translate3d(' + i + ')');
175								}else{
176									stylehtml_new = stylehtml.replace(/to {transform:translate3d\((.*?)\)/,'to {transform:translate3d(' + i + ')');
177								}
178								$('#' + styleid + '_style').html(stylehtml_new);
179							},100)
180						});
181					}
182				};
183
184				if (window.loaded) {
185					_onload();
186				} else {
187					$(window).on('load', _onload);
188				}
189			});
190
191		}
192	});
193})(jQuery);
194
195$(function () {
196	$('a[href*=\\#]:not([href=\\#])').on('click', function () {

197	  if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
198		var $target = $(this.hash);
199		$target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');
200		if ($target.length) {
201		  if ($(this).parents('.js-header-drawerMenu').length) {
202			setTimeout(function () {
203			  var targetOffset = $target.offset().top;
204			  $('html,body').animate({ scrollTop: targetOffset }, 1000);
205			}, 100);
206		  } else {
207			var targetOffset = $target.offset().top;
208			$('html,body').animate({ scrollTop: targetOffset }, 1000);
209		  }
210		  return false;
211		}
212	  }
213	});
214  
215	var state = false;
216	var scrollpos;
217  
218	$('.js-hamburger').on('click', function () {
219	  if (state == false) {
220		scrollpos = $(window).scrollTop();
221		$('body').addClass('fixed').css({ 'top': -scrollpos });
222		$('.js-hamburger').addClass('active');
223		$('.header').addClass('on');
224		$('.js-header-drawerMenu').stop().fadeIn();
225		state = true;
226	  } else {
227		$('body').removeClass('fixed').css({ 'top': 0 });
228		document.documentElement.style.scrollBehavior = 'auto';
229		window.scrollTo(0, scrollpos);
230		setTimeout(function() {
231		  document.documentElement.style.scrollBehavior = 'smooth';
232		}, 0);
233		$('.js-hamburger').removeClass('active');
234		$('.header').removeClass('on');
235		$('.js-header-drawerMenu').fadeOut();
236		state = false;
237	  }
238	  return false;
239	});
240  
241	$('.js-header-drawerMenu a:not(.accordion,[href^="tel:"]),.header-drawerMenu-close a').on('click', function () {
242		
243	  $('body').removeClass('fixed').css({ 'top': 0 });
244	  document.documentElement.style.scrollBehavior = 'auto';
245	  window.scrollTo(0, scrollpos);
246	  setTimeout(function() {
247		document.documentElement.style.scrollBehavior = 'smooth';
248	  }, 0);
249	  $('.js-hamburger').removeClass('active');
250	  $('.header').removeClass('on');
251	  $('.js-header-drawerMenu').fadeOut();
252	  state = false;
253	});
254  
255	// スクロール量が 220px を超えたら .header-box に fixed を付ける。
256	//  ① .scrollTop() ではなくブラウザが保持している window.pageYOffset を読む（レイアウト計算が走らない）
257	//  ② requestAnimationFrame で1フレームに1回だけ判定する
258	//  ③ 状態が変わったときだけクラスを操作する（毎回 addClass/removeClass しない）
259	var headerBox = document.querySelector('.header-box');
260	var isFixed = null;
261	var ticking = false;
262	var applyHeaderFixed = function () {
263	  ticking = false;
264	  if (!headerBox || state != false) return;
265	  var next = window.pageYOffset > 220;
266	  if (next === isFixed) return;
267	  isFixed = next;
268	  headerBox.classList.toggle('fixed', next);
269	};
270	window.addEventListener('scroll', function () {
271	  if (ticking) return;
272	  ticking = true;
273	  window.requestAnimationFrame(applyHeaderFixed);
274	}, { passive: true });
275	applyHeaderFixed();
276  
277  });
278  
279  $(window).on('load', function () {
280	var localLink = window.location + '';
281	if (localLink.indexOf("#") != -1 && localLink.slice(-1) != '#') {
282	  localLink = localLink.slice(localLink.indexOf("#") + 1);
283	  if ($('#' + localLink).length) {
284		setTimeout(function () {
285		  $('html,body').animate({ scrollTop: $('#' + localLink).offset().top }, 500);
286		}, 100);
287	  }
288	}
289  });