https://eventos.tokyo/js/common.js

1//jQuery(document).ready(function(){
2$(window).on('load', function() {
3
4  // カテゴリーの開閉
5  jQuery('.catLink .children').parent().append('<span></span>');
6  jQuery(document).on('click','.catLink .cat-item>span',function(){
7    jQuery(this).toggleClass('open').siblings('.children').stop().slideToggle();
8  });
9
10  // スムーススクロール
11  var $body = $('body,html');
12  $('a[href^="#"]').on('click', function(e){
13    var $header = $('#header'); // ヘッダの高さを取得（PCとスマホで異なる）
14    var buffer = 0;
15    if ($header.length){
16      buffer += $header.innerHeight();
17    }
18    var speed = 400;
19    var href = $(this).attr("href");
20    var target = $(href == "#" || href == "" ? 'html' : href);
21    var position = Math.floor(target.offset().top - buffer);
22    smoothScroll(target, position, speed, buffer, 0);
23    return false;
24  });
25  function smoothScroll(target, position, speed, buffer, count){
26    var count;
27    count++;
28    if (count > 9 ) return false;
29    $body.animate({ scrollTop: position }, speed, 'swing', function(){
30      var dest = Math.floor(target.offset().top - buffer);
31      if(dest == position){
32        return true;
33      } else {
34        smoothScroll(target, dest, 0, buffer, count);
35      }
36    });
37  }
38
39
40  //スクロールでヘッダーナビゲーションのデザインを変える
41  var scroll = 50;
42  var scrollTop;
43  jQuery(window).scroll(function(){
44    scrollTop = jQuery(window).scrollTop();
45    if(scroll <= scrollTop){
46      jQuery('#header').addClass('js-scrolled');
47    }else{
48      jQuery('#header').removeClass('js-scrolled');
49    }
50  });
51
52  // グローバルナビゲーション（スマホ表示時）
53  jQuery(".wrapper").on('click', '.headerNavIcon', function (){
54    jQuery(this).next().slideToggle();
55    jQuery(".fadeLayer").fadeToggle();
56    jQuery('.closeIcon').fadeToggle(100);
57  });
58
59  jQuery("li.hasChildren").on("click", function() {
60    jQuery(this).children("ul.subNav").slideToggle();
61    jQuery(this).toggleClass("active");
62  });
63
64  jQuery(".subNav").on("click", function() {
65    jQuery(this).toggleClass("active");
66  });
67
68  // ページトップに戻るボタン
69  var topBtn=jQuery('div.btnPageTop');
70  topBtn.hide();
71
72  jQuery(window).on("scroll", function() {
73    if (jQuery(this).scrollTop() > 700) {
74      topBtn.fadeIn();
75    } else {
76      topBtn.fadeOut();
77    }
78  });
79  topBtn.click(function () {
80    jQuery('body,html').animate({
81      scrollTop: 0
82    }, 400);
83    return false;
84  });
85
86  // スマホの時だけ電話番号リンク
87  var device = navigator.userAgent;
88  if((device.indexOf('iPhone') > 0 && device.indexOf('iPad') === -1) || device.indexOf('iPod') > 0 || device.indexOf('Android') > 0){
89    jQuery(".number").wrap('<a href="tel:0368096064"></a>');
90  };
91
92  jQuery(".partner:has(a)").addClass("partner_target");
93});
94
95jQuery(window).on('load', function(){
96  var w = jQuery(window).width();
97  var x = 768;
98  if (w <= x) {
99
100    // スマホ表示時のみアコーディオン表示
101    jQuery('div.more').each(function(){
102      var $ele = $(this);
103      $ele.prepend('<div class="open btnArea"><a href="#" class="btn btnBlock btnBorder btnAccOpen">詳しく見る</a></div>');
104      $ele.append('<div class="close btnArea"><a href="#" class="btn btnBlock btnBorder btnAccClose">閉じる</a></div>');
105      $ele.find('.open').nextAll().hide();
106      $ele.find('.open').click(function(){
107        $ele.find('.open').hide();
108        $ele.find('.open').nextAll().slideDown();
109        return false;
110      });
111      $ele.find('.close').click(function(){
112        $ele.find('.open').show();
113        $ele.find('.open').nextAll().slideUp();
114        return false;
115      });
116    });
117
118    // #case の1ページの数を9にする
119    while(jQuery("div.caseItems").children("li").length){
120      jQuery("div.caseItems").children("li:lt(9)").wrapAll('<ul></ul>')
121    }
122    // slick.js の設定 - /index.php#case
123    jQuery('div.caseItems').slick({

124      arrows: false,
125      dots: true,
126      autoplay: false,
127      infinite: false
128    });
129
130    //詳しくはこちらで閉じてるリンクに行く場合
131    const btn_open = () => {
132      const link = document.getElementsByClassName("row2");
133      link.style.display = "flex";
134    };
135
136  } else {
137
138    // .more を削除
139    jQuery('div.more').children().unwrap();
140
141
142    // 資料をダウンロードするボタン
143    jQuery(window).on("scroll", function() {
144      if (jQuery(this).scrollTop() > 500) {
145        jQuery("div.btnDownloadFix").addClass("active");
146      } else {
147        jQuery("div.btnDownloadFix").removeClass("active");
148      }
149    });
150
151    // #case の1ページの数を14にする
152    while(jQuery("div.caseItems").children("li").length){
153      jQuery("div.caseItems").children("li:lt(14)").wrapAll('<ul></ul>')
154    };
155    // slick.js の設定 - /index.php#case
156    jQuery('div.caseItems').slick({
157      arrows: true,
158      dots: false,
159      prevArrow: '<img src="/img/ico_arrow_left_beige.svg" alt="ひとつ前に戻る" class="slick-arrow-prev">',
160      nextArrow: '<img src="/img/ico_arrow_right_beige.svg" alt="ひとつ先に進む" class="slick-arrow-next">',
161      autoplay: false,
162      infinite: false
163    });
164    // slick.js の設定 - /index.php#news
165    jQuery('div.newsItems').slick({
166      arrows: true,
167      dots: false,
168      prevArrow: '<img src="/img/ico_arrow_left_beige.svg" alt="ひとつ前に戻る" class="slick-arrow-prev">',
169      nextArrow: '<img src="/img/ico_arrow_right_beige.svg" alt="ひとつ先に進む" class="slick-arrow-next">',
170      autoplay: false,
171      infinite: false
172    });
173
174    // slick.js の設定 - /case/single.php
175    jQuery('div.relatedSlickBox').slick({
176      arrows: true,
177      dots: false,
178      prevArrow: '<img src="/img/ico_arrow_left_beige.svg" alt="ひとつ前に戻る" class="slick-arrow-prev">',
179      nextArrow: '<img src="/img/ico_arrow_right_beige.svg" alt="ひとつ先に進む" class="slick-arrow-next">',
180      autoplay: false,
181      infinite: false
182    });
183
184  }
185});