https://zaregoto-series.com/assets/js/kubikiri.js

1'use strict';
2let windowHeight;
3const Slide = () => {
4  let loop = false;
5  let slides = $('.p-hero__movie-slider .swiper-slide').length;
6  if (slides > 1) {
7    loop = true;
8  } else {
9    loop = false;
10  }
11
12  let topslide = new Swiper('.swiper-top', {
13    loop: loop,
14    autoplay: false,
15    slidesPerView: 'auto',
16    spaceBetween: 3,
17    speed: 600,
18    centeredSlides: true,
19    effect: 'fade',
20    fadeEffect: {
21      crossFade: true,
22    },
23
24    navigation: {
25      nextEl: '.swiper-button-next',
26      prevEl: '.swiper-button-prev',
27    },
28  });
29  topslide.on('activeIndexChange', function () {
30    let activesld = topslide.realIndex;
31    let changerotate = (activesld / 18) * 360; // アクティブなスライドの値%スライド合計数×360°
32    $('.p-hero__movie-circles-inner').css('transform', 'rotate(' + '-' + changerotate + 'deg)');
33  });
34
35  $('.swiper-present').each((index, slide) => {
36    // swiperを起動している個数と要素を取得
37    let slides = $(slide).find('.swiper-slide').length; // 起動しているswiperのスライド枚数を取得
38    if (slides > 1) {
39      // スライドの枚数が1より多かったら
40      new Swiper(slide, {
41        loop: true,
42        autoplay: false,
43        slidesPerView: 'auto',
44        spaceBetween: 0,
45        speed: 600,
46        centeredSlides: true,
47
48        pagination: {
49          el: '.swiper-pagination',
50        },
51      });
52    }
53  });
54};
55
56// decoslide
57const Decoslide = () => {
58  $('.deco_swiper').each((index, slide) => {
59    setTimeout(() => {
60      new Swiper(slide, {
61        loop: true,
62        autoplay: true,
63        slidesPerView: '1',
64        spaceBetween: 0,
65        speed: 1500,
66        effect: 'fade', // フェード
67        centeredSlides: true,
68        allowTouchMove: false,
69        navigation: {
70          nextEl: '.swiper-button-next',
71          prevEl: '.swiper-button-prev',
72        },
73      });
74    }, 2500 * index + 5500); // 5.5秒×
75  });
76};
77
78// scrollmodule
79const Scrollmodule = () => {
80  new SCROLL_EFFECT_MODULE({
81    elem: '[data-scroll]',
82    firstElem: '.js-scroll--first',
83    displayRatio: 0.8,
84    displayReverse: false,
85    firstDelay: 3200,
86    firstDelaySteps: 100,
87    addClassNameActive: 'is-active',
88  });
89};
90
91const Fitcont = () => {
92  let oftop = $('.p-benefit')[0].getBoundingClientRect();
93  if (oftop.top <= 0 && oftop.top < windowHeight) {
94    $('.p-benefit').addClass('js-fit');
95  } else {
96    $('.p-benefit').removeClass('js-fit');
97  }
98  const scrollHeight = $(document).height(); // ページ全体の高さ
99  const scrollPosition = windowHeight + $(window).scrollTop(); // ページの一番上からスクロールされた距離
100  const footHeight = $('footer').outerHeight(); //フッターの高さ
101
102  if (scrollHeight - scrollPosition <= footHeight) {
103    $('.p-benefit').addClass('js-bottomfit');
104  } else {
105    $('.p-benefit').removeClass('js-bottomfit');
106  }
107};
108
109const Linkshow = () => {
110  $('.p-benefit__list-itemlist-btn a').each(function () {
111    let link = $(this).attr('href');
112    if (link === '') {
113      $(this).addClass('js-disable');
114    }
115  });
116};
117
118$(function () {
119  Scrollmodule();
120  Linkshow();
121});
122
123$(window).on('scroll', function () {
124  Fitcont();
125});
126
127$(window).on('load resize', function () {
128  Slide();
129  Decoslide();
130  new MODAL_MODULE();
131  $('body').addClass('is-op');
132  setTimeout(function () {
133    $('body').addClass('is-load');
134  }, 3000);
135  windowHeight = $(window).outerHeight();
136});