https://uenomiya-taishi.ed.jp/wp2021/wp-content/themes/uenomiya-taishi_2025-1st-dev/assets/js/script.js

1"use strict"; //画像差し替え
2
3//1秒かけてフェードイン
4$(function () {
5  $('body').fadeIn(1000);
6});
7
8
9$(document).ready(function () {
10  $("#menunv ul li a img.pc").hover(function () {
11    $(this).attr("src", $(this).attr("src").replace("_off", "_on"));
12  }, function () {
13    if (!$(this).hasClass("currentPage")) {
14      $(this).attr("src", $(this).attr("src").replace("_on", "_off"));
15    }
16  });
17});
18//ページTOPへ
19
20$(function () {
21  var topBtn = $('#page-top');
22  topBtn.hide();
23  $(window).scroll(function () {
24    if ($(this).scrollTop() > 100) {
25      topBtn.fadeIn();
26    } else {
27      topBtn.fadeOut();
28    }
29  });
30  topBtn.click(function () {
31    $('body,html').animate({
32      scrollTop: 0
33    }, 1);
34    return false;
35  });
36});
37
38//スムーススクロール
39$(function () {
40  $('a[href^="#"]').click(function () {
41    var speed = 400;
42    var href = $(this).attr("href");
43    var target = $(href == "#" || href == "" ? 'html' : href);
44    var position = target.offset().top;
45    $('body,html').animate({
46      scrollTop: position
47    }, speed, 'swing');
48    return false;
49  });
50});
51// ハンバーガーメニュー
52
53$(function () {
54  var drawer = $('#drawer');
55  var link = $('#drawer a');
56  $('header button').on('click', function () {
57    drawer.toggleClass('open');
58    $('body').toggleClass('fixed');
59  });
60  link.each(function (index, element) {
61    $(element).on('click', function () {
62      drawer.toggleClass('open');
63      $('body').toggleClass('fixed');
64    });
65  });
66});
67//アコーディオン
68
69
70
71$(function () {
72  $('.js-accordion').on('click', function () {
73    var $slideBox = $(this).parent().next();
74    $slideBox.slideToggle();
75    $(this).toggleClass('open');
76    $slideBox.toggleClass('open');
77  });
78}); // SPメニューアコーディオン
79
80$(function ($) {
81  $('.Js_toggle').on('click', function () {
82    $(this).next().slideToggle(300);
83    $(this).toggleClass('open');
84  });
85});
86
87
88//MW WP Form ラジオボタンで表示切り替え
89$(function () {
90  $('[name="お問い合わせ内容"]:radio').change(function () {
91
92    var result = $("input[name='お問い合わせ内容']:checked").val();
93
94    if (result === '同窓会情報 登録について') {
95      $('.select-reunion').css('display', 'table-row');
96      $('.select-request').css('display', 'none');
97      $('.reunion-op').css('display', 'none');
98
99    } else if (result === 'その他のお問い合わせ') {
100      $('.select-reunion').css('display', 'none');
101      $('.select-request').css('display', 'table-row');
102      $('.other-op').css('display', 'none');
103
104    } else {
105      $('.select-reunion').css('display', 'none');
106      $('.select-request').css('display', 'table-row');
107      $('.other-op').css('display', 'inline');
108    }
109  });
110  $('[name="お問い合わせ内容"]:radio').ready(function () {
111
112    var result = $("input[name='お問い合わせ内容']:checked").val();
113
114    if (result === '同窓会情報 登録について') {
115      $('.select-reunion').css('display', 'table-row');
116      $('.select-request').css('display', 'none');
117      $('.reunion-op').css('display', 'none');
118
119    } else if (result === 'その他のお問い合わせ') {
120      $('.select-reunion').css('display', 'none');
121      $('.select-request').css('display', 'table-row');
122      $('.other-op').css('display', 'none');
123
124    } else {
125      $('.select-reunion').css('display', 'none');
126      $('.select-request').css('display', 'table-row');
127      $('.other-op').css('display', 'inline');
128    }
129  });
130});
131
132// 生徒の声；モーダル
133$(function () {
134  $('.js-modal-open').each(function () {
135
136    $(this).on('click', function () {
137
138      var target = $(this).data('target'),
139        modal = document.getElementById(target);
140
141      $(modal).fadeIn();
142
143      return false;
144
145    });
146
147  });
148
149  $('.js-modal-close').on('click', function () {
150
151    $('.js-modal').fadeOut();
152
153    return false;
154
155  });
156
157  $('.js-modal-content').on('click', function (evnet) {
158
159    evnet.stopPropagation();
160
161  });
162});
163
164
165// TOP:KVスライダー
166function initKvSlider() {
167  var $upper = $('.top__kv__slide--upper');
168  var $lower = $('.top__kv__slide--lower');
169
170  if (!$upper.length || $upper.hasClass('slick-initialized')) {
171    return;
172  }
173
174  $upper.slick({
175    infinite: true,

176    speed: 8000,
177    cssEase: 'linear',
178    slidesToShow: 3,
179    slidesToScroll: 1,
180    arrows: false,
181    dots: false,
182    centerMode: true,
183    centerPadding: '14px',
184    variableWidth: true,
185    autoplay: true,
186    autoplaySpeed: 0,
187    pauseOnFocus: false,
188    pauseOnHover: false,
189    draggable: false,
190    touchMove: false,
191    swipe: false,
192  });
193  $lower.slick({
194    rtl: true,
195    infinite: true,
196    speed: 8000,
197    cssEase: 'linear',
198    slidesToShow: 3,
199    slidesToScroll: 1,
200    arrows: false,
201    dots: false,
202    centerMode: true,
203    centerPadding: '14px',
204    variableWidth: true,
205    autoplay: true,
206    autoplaySpeed: 0,
207    pauseOnFocus: false,
208    pauseOnHover: false,
209    draggable: false,
210    touchMove: false,
211    swipe: false,
212  });
213}
214
215function preloadKvImages(callback) {
216  var images = $('.top__kv__contents img').get();
217
218  if (!images.length) {
219    callback();
220    return;
221  }
222
223  var remaining = images.length;
224
225  function done() {
226    remaining -= 1;
227    if (remaining <= 0) {
228      callback();
229    }
230  }
231
232  images.forEach(function (img) {
233    if (img.complete) {
234      done();
235    } else {
236      $(img).one('load error', done);
237    }
238  });
239}
240
241function fadeOutOverlayAndFadeInSlider($kvContents, $kvOverlay) {
242  $kvContents.css({
243    visibility: 'visible',
244    opacity: 0
245  });
246  initKvSlider();
247
248  preloadKvImages(function () {
249    $('.top__kv__slide--upper, .top__kv__slide--lower').slick('setPosition');
250
251    $kvOverlay.animate({
252      opacity: 0
253    }, 500, function () {
254      $kvOverlay.css({
255        opacity: '',
256        visibility: 'hidden'
257      });
258    });
259    $kvContents.animate({
260      opacity: 1
261    }, 500);
262  });
263}
264
265// TOP:KV動画
266$(function () {
267  var $kvVideoContainer = $('.top__kv__movie');
268  var $kvVideo = $('.top__kv__movie video');
269  var $kvContents = $('.top__kv__contents');
270  var $kvOverlay = $('.top__kv__overlay');
271
272  if (!$kvVideo.length) {
273    return;
274  }
275
276  $kvVideo.prop('loop', false);
277
278  $kvVideo.on('ended', function () {
279    var $video = $(this);
280    $video.fadeOut(500, function () {
281      $kvOverlay.css({
282        opacity: 1,
283        visibility: 'visible'
284      });
285      $kvVideoContainer.css({
286        opacity: 0,
287        visibility: 'hidden'
288      });
289      fadeOutOverlayAndFadeInSlider($kvContents, $kvOverlay);
290    });
291  });
292});
293
294// TOP：モーダル
295$(function () {
296  var modal = $('.top__modal__outline');
297  var closebtn = $('.top__modal__closebtn');
298  var modalbg = $('.top__modal__bg');
299
300  $(closebtn).on('click', function () {
301    $(modal).css('z-index', '-1');
302    $(modal).css('opacity', '0');
303  });
304
305  $(modalbg).on('click', function () {
306    $(modal).css('z-index', '-1');
307    $(modal).css('opacity', '0');
308  });
309
310
311});