https://kuramore.jp/trend/js/common.js

1window.util = {};
2window.util.isSP = ($(window).width() <= 767) ? true : false;
3window.util.isPC = (window.util.isSP) ? false : true;
4
5/**
6 * 日本語表記の数値文字列に変換する(小数以下は四捨五入)
7 * 
8 * @param {string} val 変換対象文字列
9 * @param {number} startJapaneseUnit 日本語表記の開始位置[0: 空(0)から開始, 1: 万から開始]
10 **/
11window.util.convertJapaneseNumber = function (val, startJapaneseUnit) {
12  // 小数四捨五入
13  var number = Math.round(val);
14  if(isNaN(number) || number == 0){
15    return val;
16  }
17  
18  const japaneseUnits = ['', '万', '億', '兆'];
19  const japaneseSeparatorUnit = 10000;
20  var result = [];
21  
22  for (var i = startJapaneseUnit; i < japaneseUnits.length; i++) {
23    // 分割の最終処理
24    if (i == japaneseUnits.length - 1) {
25      result.push(number.toLocaleString() + japaneseUnits[i]);
26      break;
27    }
28
29    // 日本語表記の桁区切り処理
30    var divide = number / japaneseSeparatorUnit;
31    var remainder = number % japaneseSeparatorUnit;
32    
33    if (remainder != 0) {
34      result.push(remainder.toLocaleString() + japaneseUnits[i]);
35    }
36    
37    // 次ループの確認＆準備
38    number = Math.floor(divide);
39    if (number == 0) {
40      break;
41    }
42  }
43  
44  return result.reverse().join('');
45}
46
47var Common = {
48  onLoad: function () {
49    Common.scrollInPage(); // ページ内スクロールボタン処理
50    Common.changePositionScrollTop(); // ページトップスクロールボタン追従位置切替
51    Common.changeDisplayCTA(); // 追従CTA表示切替
52    Common.changeDisplayFollowingBox(); // 追従ボックス表示切替
53    Common.scrollTopBtn(); // トップにスクロールするボタン処理
54    Common.changeDisplayAccordion(); // アコーディオン表示切替
55    Common.changeDisplayHamburgerMenu(); // ハンバーガーメニュー表示切替
56    Common.changeAccordionHamburgerMenu(); // ハンバーガーメニュー内アコーディオン表示切替
57    Common.transitionListReviewLink(); // 口コミリンク遷移
58    Common.toggleShowAccordDom(); // 汎用アコーディオン表示切替
59  },
60  /**
61   * ページ内スクロール
62   **/
63  scrollInPage: function () {
64    $('a.js-scroll[href^="#"]').click(function () {
65      var href = $(this).attr("href");
66      var target = $(href == "#" || href == "" ? 'html' : href);
67      var position = target.offset().top
68      $('html').animate({
69        scrollTop: position
70      }, 500);
71      return false;
72    });
73  },
74  /**
75   * ページトップスクロールボタン追従位置切替
76   **/
77  changePositionScrollTop: function () {
78    // ページトップへ戻るボタン
79    if ($(".footer-band").length > 0) {
80      var scrollTop = $(window).scrollTop();
81      var bandHeight = $(".footer-band").offset().top;
82      var scrollHeight = scrollTop + $(window).height();
83      if (100 < scrollTop && scrollHeight < bandHeight) {
84        $('.footer-goto-top').fadeIn();
85        $(".footer-goto-top").fadeIn(300).addClass("is-fixed");
86      } else if (100 > scrollTop && scrollHeight < bandHeight ) {
87        $('.footer-goto-top').fadeOut();
88      } else {
89        $(".footer-goto-top").removeClass("is-fixed");
90      }
91    }
92  },
93  /**
94   * 追従CTA表示切替
95   **/
96  changeDisplayCTA: function () {
97    // 追従CTA
98    if ($('footer').length > 0) {
99      var footerHeight = $('footer').offset().top;
100      // 追従CTAにクラス名js-show-lateを持つか持たないかで表示タイミング分岐
101      if ($('.fix-btn-wrapper').hasClass('js-show-late')) {
102        if (window.util.isPC) {
103          // 追従CTA処理 スクロール処理を行ってから～footer以降に現在の表示位置が来たらCTAを消す
104          if ($(window).scrollTop() > 100 && $(window).scrollTop() + $(window).height() < footerHeight) {
105            $('.fix-btn-wrapper .CTA-btn').fadeIn();
106          } else {
107            $('.fix-btn-wrapper .CTA-btn').fadeOut();
108          }
109        } else {
110          if ($(window).scrollTop() > 0 && $(window).scrollTop() + $(window).height() < footerHeight) {
111            $('.fix-btn-wrapper .CTA-btn').fadeIn();
112          } else {
113            $('.fix-btn-wrapper .CTA-btn').fadeOut();
114          }
115        }

116        // 追従CTAにクラス名js-show-startを持つか持たないかで表示タイミング分岐
117      } else if ($('.fix-btn-wrapper').hasClass('js-show-start')) {
118        if (window.util.isPC) {
119          // 追従CTA処理 FV～footer以降に現在の表示位置が来たらCTAを消す
120          if ($(window).scrollTop() + $(window).height() < footerHeight) {
121            $('.fix-btn-wrapper .CTA-btn').fadeIn();
122            $('.fix-btn-wrapper .btn-anchor').fadeIn();
123          } else {
124            $('.fix-btn-wrapper .CTA-btn').fadeOut();
125            $('.fix-btn-wrapper .btn-anchor').fadeOut();
126          }
127        } else {
128          if ($(window).scrollTop() > 0 && $(window).scrollTop() + $(window).height() < footerHeight) {
129            $('.fix-btn-wrapper .CTA-btn').fadeIn();
130            $('.fix-btn-wrapper .btn-anchor').fadeIn();
131          } else {
132            $('.fix-btn-wrapper .CTA-btn').fadeOut();
133            $('.fix-btn-wrapper .btn-anchor').fadeOut();
134          }
135        }
136      } else {
137        if ($(window).scrollTop() > 0 && $(window).scrollTop() + $(window).height() < footerHeight) {
138          $('.fix-btn-wrapper .CTA-btn').fadeIn();
139        } else {
140          $('.fix-btn-wrapper .CTA-btn').fadeOut();
141        }
142      }
143    }
144  },
145  /**
146   * 追従ボックス表示切替
147   **/
148  changeDisplayFollowingBox: function () {
149    if ($('footer').length > 0) {
150      var footerLogoHeight = $('footer .footer-starts').offset().top;
151      if ($(window).scrollTop() + $(window).height() < footerLogoHeight) {
152        $('.fix-btn-wrapper .js-fix-wrapper').fadeIn();
153      } else {
154        $('.fix-btn-wrapper .js-fix-wrapper').fadeOut();
155      }
156    }
157  },
158  /**
159   * トップにスクロールするボタン処理
160   **/
161  scrollTopBtn: function () {
162    $('.footer-goto-top a').click(function () {
163      $('body,html').animate({
164        scrollTop: 0
165      }, 700);
166      return false;
167    });
168  },
169  /**
170   * アコーディオン表示切替
171   **/
172  changeDisplayAccordion: function () {
173    var $accordTab = $(".js-accord-tab");
174    if ($accordTab.hasClass('is-active')) {
175      $accordTab.next().hide();
176    }
177    $accordTab.on("click", function () {
178      $(this).toggleClass("is-active");
179      $(this).next().slideToggle(250);
180      var $accordTabCheck = $(".js-accord-tab_check");
181      $accordTabCheck.parent().next().hide(), $accordTabCheck.on("click", function () {
182        $(this).parent().toggleClass("is-active");
183        $(this).parent().next().slideToggle(250);
184      });
185    });
186  },
187  /**
188   * ハンバーガーメニュー表示切替
189   **/
190  changeDisplayHamburgerMenu: function () {
191    // ハンバーガーメニューのボタンがクリックされたら
192    $(".hamburgerMenu .openbtn ,.hamburgerMenu #g-nav .btn-bottom").click(function () {
193      // 背景固定用クラス名付与・削除
194      $("html").toggleClass("body-fixed");
195      // openボタンに対しactiveクラスを付与・削除
196      $(".hamburgerMenu .openbtn").toggleClass('active');
197      if ($(".hamburgerMenu .openbtn.active").length) {
198        var currentScrollY = $(window).scrollTop();
199        // ハンバーガーメニューopenボタンクリック時のhtmlスクロール値をdata属性に持たせる
200        $('html').data('scroll', currentScrollY);
201        $('html.body-fixed').css({
202          position: 'fixed',
203          top: -1 * currentScrollY
204        });
205        // ナビにpanelactiveクラスを付与
206        $(".hamburgerMenu #g-nav").addClass('panelactive');
207      } else {
208        var scrollData = $('html').data('scroll');
209        // ナビにpanelactiveクラスを削除
210        $(".hamburgerMenu #g-nav").removeClass('panelactive');
211        $('html').css({
212          position: 'static',
213          top: 'auto'
214        });
215        // スクロール位置を保持した状態にする
216        $("html,body").scrollTop(scrollData);
217      }
218    });
219  },
220  /**
221   * ハンバーガーメニュー内アコーディオン切り替え
222   **/
223  changeAccordionHamburgerMenu: function () {
224    $('.hamburgerMenu .toggle-title').click(function () {
225      $(this).toggleClass('selected');
226      $(this).next().slideToggle();
227    });
228  },
229  /**
230   * 口コミリンク遷移
231   **/
232  transitionListReviewLink: function () {
233    $('.js-review-link').on('click', function (e) {
234      e.preventDefault();
235      var detailUrl = $(this).parents('.building-link').prop('href');
236      var reviewUrl = detailUrl + 'review/';
237      window.open(reviewUrl, '_blank')
238    });
239  },
240  /**
241   * 汎用アコーディオン表示切替
242   **/
243  toggleShowAccordDom: function () {
244  $('.js-accord-btn').on('click', function () { // アコーディオンボタン選択後
245    $(this).toggleClass('is-active');
246    $(this).parents('.js-accord-wrapper').find('.js-accord-box').slideToggle();
247  });
248},
249  allEvent: function () {
250    document.addEventListener("DOMContentLoaded", function () {
251      Common.onLoad();
252    }), window.addEventListener("scroll", function () {
253      Common.changeDisplayCTA();
254      Common.changeDisplayFollowingBox();
255      Common.changePositionScrollTop();
256    })
257  }
258};
259Common.allEvent();