https://ise-ydc.jp/wp-content/themes/ydc/js/common.js

1
2
3
4jQuery(function($) {
5  const $header = $('#header');
6  const $logo = $('.header-logo');
7  const isTop = $('body').hasClass('home');
8
9  if (isTop) {
10    $(window).on('scroll', function() {
11      if ($(window).scrollTop() > 300) {
12        $header.addClass('fixed');
13        $logo.addClass('change-logo');
14      } else {
15        $header.removeClass('fixed');
16        $logo.removeClass('change-logo');
17      }
18    });
19  } else {
20    // トップ以外は最初から固定＋サブロゴ
21    $header.addClass('fixed');
22    $logo.addClass('change-logo');
23  }
24});
25
26
27
28//ハンバーガーメニュー
29$(function () {
30	$('.humburger-btn').click(function () {
31		$(this).toggleClass('active');
32		$(".header-container").toggleClass('active');
33		$(".humburger-menu").toggleClass('open');
34		$('html').toggleClass('scroll-prevent');
35
36		$('nav ul li a').on('click', function () {
37			//if (window.innerWidth <= 768) {
38			$('.humburger-btn').click();
39			$('html').removeClass('scroll-prevent');
40			// }
41		});
42	});
43});
44
45
46
47
48// 初回訪問チェック
49const isFirstVisit = !sessionStorage.getItem('visited');
50
51// 初回だけローディング表示
52if (isFirstVisit) {
53	sessionStorage.setItem('visited', 'true');
54
55	$('body').addClass('loading');
56
57	// DOM読み込み後にランダム画像をセット
58	$(function () {
59		const images = [
60			"https://cont-p.com/ydc/wp-content/themes/ydc/images/common/loading-01.jpg",
61			"https://cont-p.com/ydc/wp-content/themes/ydc/images/common/loading-02.jpg",
62			"https://cont-p.com/ydc/wp-content/themes/ydc/images/common/loading-03.jpg"
63		];
64
65		const randomIndex = Math.floor(Math.random() * images.length);
66		const selectedImage = images[randomIndex];
67
68		$('#random-img').on('load', function () {
69			$('#loading').addClass('show-img');
70		});
71
72		$('#random-img').attr('src', selectedImage);
73	});
74
75	// ウィンドウ読み込み後
76	$(window).on('load', function () {
77		setTimeout(function () {
78			$('#loading').addClass('show-logo');
79		}, 1200);
80
81		setTimeout(function () {
82			$('body').removeClass('loading');
83			$('#loading').css('opacity', '0');
84
85			setTimeout(function () {
86				$('#loading').remove();
87			}, 1500);
88		}, 2500);
89	});
90
91} else {
92	// 2回目以降は即削除
93	$('#loading').remove();
94	$('body').removeClass('loading');
95}
96
97
98//step-slider
99$(function () {
100	$(".step-slider")
101		.on("init", function (event, slick) {
102			$(this).append('<div class="slick-num"><span class="now-count"></span> / <span class="all-count"></span></div>');
103			$(".now-count").text(slick.currentSlide + 1); // 現在のスライド番号(+1が無いと0からスタートしてしまう)
104			$(".all-count").text(slick.slideCount); // スライドの総数
105		})
106
107		.slick({
108			arrows: true,
109			appendArrows: $('.arrow_box'),
110			prevArrow: '<div class="slide-arrow prev-arrow"></div>',
111			nextArrow: '<div class="slide-arrow next-arrow"></div>',
112			autoplay: false,
113			adaptiveHeight: true,
114			centerMode: true,
115			centerPadding: "0%",
116			slidesToShow: 1,
117		})
118
119		.on("beforeChange", function (event, slick, currentSlide, nextSlide) {
120			$(".now-count").text(nextSlide + 1); // 現在のスライド番号の次のスライドになったら番号を+1
121		});
122
123
124});
125
126//staff-slider
127// staff-slider
128$(function () {
129  var $slider = $(".staff-slider");
130
131  // 数字UIの生成＆更新（init済みでも動くように）
132  function setSlickNum(slick) {
133    var $root = $(slick.$slider);
134
135    if ($root.find(".slick-num").length === 0) {
136      $root.append(
137        '<div class="slick-num"><span class="now-count"></span> / <span class="all-count"></span></div>'
138      );
139    }
140
141    $root.find(".now-count").text(slick.currentSlide + 1);
142    $root.find(".all-count").text(slick.slideCount);
143  }
144
145  // init / reInit で作る
146  $slider.on("init reInit", function (event, slick) {
147    setSlickNum(slick);
148  });
149
150  // 変更後も更新（beforeChangeでもいいけどafterChangeの方が安定）
151  $slider.on("afterChange", function (event, slick) {
152    setSlickNum(slick);
153  });
154
155  // まだ初期化されてない時だけ slick() する（2重初期化防止）
156  if (!$slider.hasClass("slick-initialized")) {
157    $slider.slick({
158      arrows: true,
159      appendArrows: $(".arrow_box"),
160      prevArrow: '<div class="slide-arrow prev-arrow"></div>',
161      nextArrow: '<div class="slide-arrow next-arrow"></div>',
162      autoplay: false,
163      adaptiveHeight: true,
164      centerMode: false,
165      slidesToShow: 4,
166      slidesToScroll: 1, // PCは1枚ずつ（4枚ずつなら4に）
167      infinite: true,
168      responsive: [
169        {
170          breakpoint: 768,
171          settings: {
172            slidesToShow: 1,
173            slidesToScroll: 1,
174			centerMode: true,       
175            centerPadding: "10%",    
176          }
177        }
178      ]
179    });
180  } else {
181    // すでに初期化済みでも表示だけは作る
182    var slickObj = $slider.slick("getSlick");
183    setSlickNum(slickObj);
184  }
185});
186
187
188// faq アコーディオン
189jQuery(function () {
190	jQuery('.answer').hide();
191	jQuery('.question').click(function () {
192		jQuery(this).toggleClass("open");
193		jQuery(this).next('.answer').slideToggle();
194	});
195});
196
197
198$(function () {
199	$('.svg-icon').each(function () {
200		const $container = $(this);
201		const svgPath = $container.data('src');
202
203		$.get(svgPath, function (data) {
204			const $svg = $(data).find('svg');
205			// fill属性にcurrentColorを適用（既に入ってる場合はそのままでOK）

206			$svg.find('[fill]').each(function () {
207				if ($(this).attr('fill') !== '#fff') {
208					$(this).attr('fill', 'currentColor');
209				}
210			});
211			$container.html($svg);
212		}, 'xml');
213	});
214});
215
216