https://kodomoliving.co.jp/assets/js/common.js?v=2022072101

1jQuery(function($){
2  const breakpointMobile = 1024;
3  let isSPMode = false;
4
5  /*
6  ブラウザリサイズ処理
7  */
8  function resizeSPMode(){
9    //
10  }
11  function resizePCMode(){
12    //
13  }
14  const getWindowSize = function(){
15    var w = $(window).width();
16    var h = $(window).height();
17    $('#dataProvider').attr("data-windowWidth", w);
18    $('#dataProvider').attr("data-windowHeight", h);
19    if (w <= breakpointMobile){
20      resizeSPMode();
21      isSPMode = true;
22    } else {
23      resizePCMode();
24      isSPMode = false;
25    }
26  };
27  $(window).resize(function(){
28    getWindowSize();
29  });
30  getWindowSize();
31
32  /*
33  PC ローカルナビにあわせた調整
34  */
35  const setMain = function(){
36    const localNavHeight = $('.local-nav.here').height();
37    $('main').removeClass();
38    if (typeof localNavHeight !== 'undefined'){
39      switch (localNavHeight) {
40        case 120:
41          $('main').addClass('double-local');
42          break;
43        default:
44      }
45    } else {
46      $('main').addClass('no-local');
47    }
48  }
49
50  /*
51  Copyright
52  */
53  const date = new Date();
54	const year = date.getFullYear();
55	const copyright = "<p>Copyright &copy; "+year+" こどもりびんぐ Inc. All rights reserved.</p>";
56
57	$("#footer-copy")[0].innerHTML = copyright;
58
59  /*
60  Here
61  */
62  const setHere = function(){
63    if (typeof hereGlobal !== 'undefined'){
64      $('#'+hereGlobal).children('a').addClass('here');
65      $('#'+hereGlobal).children('.local-nav').addClass('here');
66    }
67    if (typeof hereLocal !== 'undefined'){
68      $('#'+hereLocal).children('a').addClass('here');
69    }
70    setMain();
71  }
72  setHere();
73
74  /*
75  GN hover
76  */

77  $('html').mousemove(
78    function(e) {
79      const l =  $('#global-nav__hover').offset().left;
80      const r =  $('#global-nav__hover').outerWidth() + l;
81      const t =  $('#global-nav__hover').offset().top;
82      const b =  $('#global-nav__hover').outerHeight() + t;
83      if (e.pageX >= l && e.pageX <= r && e.pageY >= t - 10 && e.pageY <= b) {
84        //
85      } else {
86        $('.local-nav').removeClass('hover');
87      };
88    }
89  );
90  $('.global-nav__item').hover(
91    function() {
92      $('.local-nav').removeClass('hover');
93      $(this).children('.local-nav').addClass('hover');
94      $('#global-nav__hover').outerHeight($('#global-nav').outerHeight() + $('#global-nav__main').outerHeight() + parseInt($('.local-nav').css('top')) + $('.local-nav.hover').height());
95      // console.log('global:' + $('#global-nav').outerHeight());
96      // console.log('local:' + $('.local-nav').css('top'));
97      // console.log('hover:' + $('.local-nav.hover').height());
98      // console.log('sum:' + $('#global-nav__hover').outerHeight());
99    },
100    function() {
101      //
102    }
103  );
104
105  /*
106  SPだけTEL
107  */
108  const ua = navigator.userAgent.toLowerCase();
109  const isMobile = /iphone/.test(ua)||/android(.+)?mobile/.test(ua);
110  if (!isMobile) {
111    $('a[href^="tel:"]').on('click', function(e) {
112      e.preventDefault();
113    });
114  };
115
116  /*
117  検索窓
118  */
119  $('#global-nav__search__btn').click(function(){
120    if ($('#global-nav__contact').isVisible()){
121      $('#global-nav__contact').hide(100, function(){
122        $('#global-nav__search__text').show(100);
123      });
124    } else if($('#global-nav__search__text').val().length > 0) {
125      $('#global-nav__search form').submit();
126    } else {
127      $('#global-nav__search__text').hide(100, function(){
128        $('#global-nav__contact').show(100);
129      });
130    }
131  });
132  $.fn.isVisible = function() {
133    return $.expr.filters.visible(this[0]);
134  };
135
136  /*
137  リサーチ検索窓
138  */
139  $('#research-search__btn').click(function(){
140    $('#research-search form').submit();
141  });
142
143  /*
144  スクロールアクション
145  */
146
147  //ページ内リンク
148  if ($('#page-nav').length) {
149    const topPageNav = $('#page-nav').offset().top;
150    const topPageNavOriginal = $('#breadcrumb').offset().top + $('#breadcrumb').height();
151    const heightPageNav = $('#page-nav').height();
152    $(document).scroll(function(){
153      scrolled = $(this).scrollTop();
154      //途中から固定
155      if (topPageNav - 10 <= scrolled) {
156        $('#page-nav').addClass('fixed');
157      } else {
158        $('#page-nav').removeClass('fixed');
159      }
160      //フッタ近くで消去
161      topFooter = $('footer').offset().top;
162      bottomPageNav = scrolled + heightPageNav + 10;
163      if (bottomPageNav >= topFooter) {
164        $('#page-nav').addClass('transparent');
165      } else {
166        $('#page-nav').removeClass('transparent');
167      }
168      //ページナビのHERE判別
169      const here = $('.c-container').get().reverse().find(container => $(container).offset().top <= $('#page-nav').offset().top + $('#page-nav').height());
170      $('.page-nav__item a').removeClass('here');
171      $('.page-nav__item a[href="#'+$(here).attr('id')+'"]').addClass('here');
172      /*.c-containerをすべてリストアップ
173      それぞれのTOPを取得
174      #page-navのトップがどこの間にあるかで判別
175      */
176      // console.log(bottomPageNav + ' : ' + topFooter);
177    });
178
179    //ページ内スクロール
180    $('a[href^="#"]').click(function(){
181      const speed = 500;
182      const href= $(this).attr("href");
183      const target = $(href == "#" || href == "" ? 'html' : href);
184      const position = target.offset().top;
185      let marginTop = 0;
186      if (isSPMode) {
187        marginTop = heightPageNav - 1;
188        // if ($('#page-nav').hasClass('fixed')) {
189        //   marginTop = heightPageNav - 1;
190        // } else {
191        //   // marginTop = $('header').height() + topPageNavOriginal + heightPageNav  - 1;
192        //   marginTop = $('header').height() + $('#breadcrumb').height() + heightPageNav + 40;
193        // }
194      } else {
195        marginTop = 0;
196      }
197      $("html, body").animate({scrollTop:position-marginTop}, speed, "swing");
198      return false;

199    });
200
201  }
202
203  $(document).scroll(function(){
204    scrolled = $(this).scrollTop();
205    //ボトムオーバーレイ表示
206    if (scrolled > 700) {
207      $('#footer-overlay').addClass('appear');
208    } else {
209      $('#footer-overlay').removeClass('appear');
210    }
211    // console.log(bottomPageNav + ' : ' + topFooter);
212  });
213
214  /*
215  バックトゥトップ
216  */
217  $('#page-top').click(function () {
218      $('body,html').animate({
219          scrollTop: 0
220      }, 500);
221      return false;
222  });
223
224  /*
225  footerの背景色
226  */
227  if ($('main div:last-child').hasClass('c-container--variant')) {
228    $('footer').addClass('footer--variant');
229  }
230
231  /*
232  page-navのspacer
233  */
234  // TODO: page-navの高さをGETしてspacerの高さにセット
235
236  /*
237  SPメニュ
238  */
239  $('#sp-menu__btn').click(function(){
240    // $('#global-nav').toggle(100);
241    $('#global-nav').slideToggle(100);
242  });
243
244  /*
245  1文字ずつ色を変える
246  */
247  $(".u-text--colorful").children().addBack().contents().each(function(){
248    if (this.nodeType == 3) {
249      var $this = $(this);
250      $this.replaceWith($this.text().replace(/(\S)/g, "<span>$&</span>"));
251    }
252   });
253
254  /*
255  メインビジュアルのアニメーションキャッシュ対応
256  */
257  let timestamp = new Date().getTime();
258  $('#top-main_visual__image').attr('src', '/assets/images/main_visual.gif' + '?' + timestamp);
259
260  /*
261  アコーディオン
262  */
263  $('.c-accordion__btn').click(function(e){
264    const panel = $(e.target).next('.c-accordion__panel');
265    if(panel.css("display")=="none"){
266      panel.slideDown();
267      $(e.target).removeClass('c-accordion__arrow--down');
268      $(e.target).addClass('c-accordion__arrow--up');
269      $(e.target).addClass('c-accordion__btn--hover');
270    } else {
271      panel.slideUp();
272      $(e.target).addClass('c-accordion__arrow--down');
273      $(e.target).removeClass('c-accordion__arrow--up');
274      $(e.target).removeClass('c-accordion__btn--hover');
275    }
276  })
277
278
279});