https://free-max.com/assets/js/script.js

1
2jQuery(function ($) { // この中であればWordpressでも「$」が使用可能になる
3  const pagetop = $('.js-page-top');
4
5  // TABS 
6  if( $('.wapperFaq').length ){
7      $('.wapperFaq .boxListFaq .faq-item.active').show();
8      $('.wapperFaq .boxListTab .listTab li').click(function() {
9          $(this).addClass('active').siblings().removeClass('active');
10          var showTab = $(this).find('a').attr('data-tab');
11          console.log(showTab);
12          $(this).closest('.wapperFaq').find('.faq-item').hide();
13          $(this).closest('.boxListTab').siblings('.boxListFaq').find(showTab).fadeIn();
14          return false;
15      });
16  }
17
18  // ボタンをクリックしたらスクロールして上に戻る
19  pagetop.click(function () {
20    $('body,html').animate({
21      scrollTop: 0
22    }, 300, 'swing');
23    return false;
24  });
25
26  const header = $('.js-header');
27  const headerHeight = $('.js-header').outerHeight(); 
28  const mainviewHeight = $('.js-mainview').outerHeight(); 
29
30  $(window).on('load scroll', function () {
31    if ($(window).scrollTop() < mainviewHeight) {
32      pagetop.removeClass('is-active');
33    } else {
34      pagetop.addClass("is-active");
35
36    }
37  });
38  
39  $('.js-hamburger').on('click', function () {
40    if ($('.js-hamburger').hasClass('open')) {
41      $(this).removeClass('open');
42      $('.js-drawer-menu').fadeOut(300);
43      $('.js-header').removeClass("is-active");
44      $('body').removeClass("noscroll");
45    } else {
46      $(this).addClass('open');
47      $('.js-drawer-menu').fadeIn(300);
48      $('.js-header').addClass("is-active");
49      $('body').addClass("noscroll");
50    }
51  });
52  $('.js-drawer-menu,.js-drawer-top,.js-header-overlay').on('click', function () {
53    $(".js-hamburger").removeClass('open');
54    $('.js-drawer-menu').fadeOut(300);
55    $('.js-header').removeClass("is-active");
56    $('body').removeClass("noscroll");
57  });
58
59
60  const smooth_headerHeight = $('.js-header').outerHeight();
61  const urlHash = location.hash;
62  const time = 500;
63  if (urlHash) {
64    $(window).on('load', function () {
65    $('body,html').stop().scrollTop(0);
66    setTimeout(function () {
67      var target = $(urlHash);
68      var position = target.offset().top - smooth_headerHeight;
69      $('body,html').stop().animate({ scrollTop: position }, time);
70    }, 100);
71  });
72  
73  }
74  $(document).on('click', 'a[href*="#"]', function () {
75    console.log('クリック')
76    if ($('.js-hamburger').hasClass('open')) {
77      $(this).removeClass('open');
78      $('.js-drawer-menu').fadeOut(300);
79      $('.js-header').removeClass("is-active");
80      $('body').removeClass("noscroll");
81    }
82    let target = $(this.hash);
83    if (!target.length) return;
84    let targetY = target.offset().top - smooth_headerHeight;
85    $('html,body').animate({ scrollTop: targetY }, time, 'swing');
86    return false;
87  });
88
89
90}); // jQuery
91
92const movefun = function( event ){
93	event.preventDefault();
94}
95window.addEventListener( 'touchmove' , movefun , { passive: false } );
96window.removeEventListener( 'touchmove' , movefun, { passive: false } );
97
98document.addEventListener('DOMContentLoaded', () => {
99  const tabTriggers = document.querySelectorAll('.js-tab-trigger');
100  const tabTargets = document.querySelectorAll('.js-tab-target');
101  for (let i = 0; i < tabTriggers.length; i++) {
102      // タブメニュークリック時
103      tabTriggers[i].addEventListener('click', (e) => {
104          let currentMenu = e.currentTarget;
105          let currentContent = document.getElementById(currentMenu.dataset.id);
106
107          for (let i = 0; i < tabTriggers.length; i++) {
108              tabTriggers[i].classList.remove('is-active');
109          }
110          currentMenu.classList.add('is-active');
111          for (let i = 0; i < tabTargets.length; i++) {
112              tabTargets[i].classList.remove('is-active');
113          }
114          if (currentContent !== null) {
115              currentContent.classList.add('is-active');
116          }
117      });
118  }
119});