https://www.tokiwa-hs.ed.jp/assets/js/script.js?ver=1790980954

1// ページ共通スクリプト
2
3(function () {
4  "use strict";
5  // DOM読み込み前処理ここから
6
7  // 定数定義
8  var BREAK_POINT_SM = 768;
9  var BREAK_POINT_XL = 1025;
10
11  var $breakpoint = BREAK_POINT_SM;
12  var pcViewWidth = BREAK_POINT_XL;
13  var $WindowWidth = window.innerWidth;
14
15  // タブレットではPCのViewportで表示する
16  var vp = document.querySelector('[name="viewport"]');
17  if (vp) {
18    var media = matchMedia("(min-width: " + ($breakpoint - 1) + "px)");
19    if (media.matches) {
20      vp.content = "width=" + pcViewWidth;
21    }
22  }
23
24  //デバイス判定（タッチが有効か否か）
25  var isTouchDevice =
26    "ontouchstart" in window ||
27    (window.DocumentTouch && document instanceof DocumentTouch);
28  //デバイス判定によるイベントの決定
29  //var eventType = isTouchDevice ? "touchend" : "click";
30  var eventType = "click";
31
32  // 画面サイズ変更の際の処理
33  function respond_style() {
34    var $WindowWidth_old = $WindowWidth;
35    $WindowWidth = window.innerWidth;
36    if ($WindowWidth_old !== $WindowWidth) {
37    }
38
39    if ($WindowWidth >= BREAK_POINT_XL) {
40      //PCのみ
41      $(".c-nav-global").removeClass("c-nav-global__open");
42      $('.c-nav-global__list-sub').removeAttr("data-active");
43      $(".l-header__links button").removeClass("nav-open");
44    } else {
45      //SPのみ
46    }
47  }
48
49  
50  // ブラウザで戻った場合
51  history.replaceState(null, document.getElementsByTagName('title')[0].innerHTML, null);
52  window.addEventListener('popstate', function(e) {
53    /*
54    if ($('#video').length) {
55      $('#video').get(0).currentTime = 0;
56      $('#video').get(0).play();
57    }*/
58    $('[data-a-inview]').attr('data-inview', true).css('transition','none');
59    $('body').addClass('historyback');
60    setTimeout(function() {
61      $('[data-a-inview]').attr('data-inview', true).css('transition','');
62      $('body').removeClass('historyback');
63    }, 300);
64  });
65
66  function smoothscroll(config) {
67    var urlHash = location.hash;
68    urlHash = urlHash.replace(/([%])/g, "\\$1");
69    if (urlHash) {
70      $("body,html").stop().scrollTop(0);
71      var target = $(urlHash);
72      move_scroll(target, config);
73    }
74
75    // #で始まるアンカーをクリックした場合に処理
76    $('a[href^="#"]').on(eventType, function (e) {
77      var href = $(this).attr("href");
78      e.preventDefault();
79      var target = $(href === "#" || href === "" ? "body" : href);
80      move_scroll(target, config);
81    });
82
83    $('a[href*="#"]').not('a[href^="#"]').on(eventType, function (e) {
84      var href = $(this).attr("href");
85      var url = location.protocol + '//' + location.hostname + location.pathname;
86      var regex = new RegExp(url);
87      if (regex.test(url)) {
88        href = href.replace(regex, "");
89        var reg = new RegExp(/^#/);
90        if (reg.test(href)) {
91          e.preventDefault();
92          var target = $(href === "#" || href === "" ? "body" : href);
93          move_scroll(target, config);
94        }
95      }
96    });
97  }
98
99  function move_scroll(target, config) {
100    // オプション
101    var o = $.extend(
102      {
103        easing: "swing", // 動作パターン
104        speed: 500, // スクロールの速度
105        margintop: 0, // スクロール位置の変更
106        headerfix: ".l-header", // 固定されているヘッダーのセレクタ
107        adjustment: 1, // 位置調整
108      },
109      config
110    );
111
112    setTimeout(function(){
113
114      var t = 0;
115      if (target.offset()) {
116        t = target.offset().top;
117      }
118      // 移動先を数値で取得
119      var position = 0;
120      if (o.headerfix !== "") {
121        var navHeight = $(o.headerfix).outerHeight();
122        if ($WindowWidth >= BREAK_POINT_SM) {
123          position = t - navHeight * o.adjustment;
124        } else {
125          position = t - navHeight * o.adjustment;
126        }
127      } else {
128        position = t - o.margintop;
129      }
130
131      $("html,body").stop().animate({ scrollTop: position }, o.speed, o.easing);
132    }, 300);
133
134    return false;
135  }
136
137  function check_current_url(re) {
138    if (re) {
139      var str = location.pathname;
140      var pattern = new RegExp(re);
141      return pattern.test(str);
142    }
143  }
144
145  function current_url(target) {
146    $(target).each(function () {
147      var str = $(this).find("a").attr("href");
148      var re = str.replace(/[./]+/g, "");
149      if (check_current_url(re)) {
150        $(target).removeAttr("data-active");
151        $(this).attr("data-active", "true");
152      }
153    });
154  }
155
156  $(window).on("resize orientationchange", respond_style);
157
158  // DOM読み込み後処理ここから
159  $(function () {
160    respond_style();
161
162    objectFitImages('[data-fit="true"] img');
163
164    // グローバルナビカレント表示
165    current_url(".c-nav-global__item");
166
167    // スムーズスクロール
168    smoothscroll();
169
170    // togle menu
171    $('[data-contents="menu"] button').on(eventType, function () {
172      $(this).toggleClass("nav-open");
173      $(".c-nav-global").toggleClass("c-nav-global__open");
174      if ($(".c-nav-global").hasClass("c-nav-global__open") === false) {
175        $('.c-nav-global__list-sub').removeAttr("data-active");
176      }
177    });
178
179    if ($WindowWidth < BREAK_POINT_XL) {
180      /*
181      $('.c-nav-global a').on(eventType, function () {
182        setTimeout(function () {
183          $('[data-contents="menu"] button').removeClass("nav-open");
184          $(".c-nav-global").removeClass("c-nav-global__open");
185        }, 200);
186      });*/
187    } 
188
189    $('.c-nav-global__list-item > a').on(eventType, function (e) {
190      if ($WindowWidth < BREAK_POINT_XL) {
191        if ($(this).parent().find('.c-nav-global__list-sub').length > 0) {
192          e.preventDefault();
193          if ($(this).parent().find('.c-nav-global__list-sub').attr("data-active")) {
194            $(this).parent().find('.c-nav-global__list-sub').removeAttr("data-active");
195          } else {
196            $(this).parent().find('.c-nav-global__list-sub').attr(
197              "data-active",
198              true
199            );
200          }
201        }
202      }
203    });
204
205    $('.c-nav-global__list-item').hover(
206      function () {
207        if ($WindowWidth >= BREAK_POINT_XL) {
208          $(this).find('.c-nav-global__list-sub').attr(
209            "data-active",
210            true
211          );
212        }
213      },
214      function () {
215        if ($WindowWidth >= BREAK_POINT_XL) {
216          $(this).find('.c-nav-global__list-sub').removeAttr("data-active");
217        }
218      }
219    );
220
221    
222
223    // news menu
224    if ($(".c-headlines__list-item").length > 0) {
225      var list_contents = $(".c-headlines__list-item[data-active=true]").attr(
226        "data-contents"
227      );
228      $(".c-headlines__body").removeAttr("data-active");
229      $(".c-headlines__body[data-contents=" + list_contents + "]").attr(
230        "data-active",
231        true
232      );
233    }
234
235    $(".c-headlines__list-item").on(eventType, function () {
236      $(".c-headlines__list-item").removeAttr("data-active");
237      var list_contents = $(this).attr("data-contents");
238      $(this).attr("data-active", true);
239      $(".c-headlines__body").removeAttr("data-active");
240      $(".c-headlines__body[data-contents=" + list_contents + "]").attr(
241        "data-active",
242        true
243      );
244    });
245
246    //matchHeight
247    if ( $('[data-height="1"]').length > 0 ) {
248      $('[data-height="1"]').matchHeight();
249    }
250
251    //fadeup
252    //$('.l-main__section-inner > *').not('[data-a-inview]').attr('data-a-inview', 'fadeup');
253
254  });
255
256  $(window).on("load scroll", function () {
257    // header
258    if ($(this).scrollTop() > 0) {
259      $(".l-header").attr("data-header", "fixed");
260    } else {
261      $(".l-header").removeAttr("data-header");
262    }
263
264    // pagetop
265    if ($(this).scrollTop() > 100) {
266      if (
267        $(".l-footer").offset().top <=
268        $(window).scrollTop() + window.innerHeight
269      ) {
270        $(".l-footer__pagetop").attr("data-pagetop-fix", false);
271        $(".l-footer__pagetop").attr("data-fixed", true);
272        $(".l-footer__pagetop").attr("data-position-absolute", true);
273      } else {
274        $(".l-footer__pagetop").attr("data-pagetop-fix", true);
275        $(".l-footer__pagetop").attr("data-fixed", true);
276        $(".l-footer__pagetop").attr("data-position-absolute", false);
277      }
278    } else {
279      $(".l-footer__pagetop").attr("data-pagetop-fix", false);
280      $(".l-footer__pagetop").attr("data-fixed", true);
281      $(".l-footer__pagetop").attr("data-position-absolute", true);
282    }
283    // inview
284
285    $("[data-a-inview]").each(function () {
286      if (
287        $(this).offset().top <=
288        $(window).scrollTop() + window.innerHeight / 1.1
289      ) {
290        $(this).attr("data-inview", true);
291      } else {
292        $(this).attr("data-inview", false);
293      }
294    });
295  });
296}.call(this));