https://www.ishimura.co.jp/_assets/js/common.js

1$(function(){
2  "use strict";
3
4  // --------------------------------------------------
5  // header - scroll min
6  // --------------------------------------------------
7  $(window).scroll(function (){
8    $(".js-header").each(function(){
9      const scroll = $(window).scrollTop();
10      if (scroll >= 79 ){
11        $(this).addClass("is-scroll");
12        $(".c-open_navi").addClass("is-scroll");
13        $("body").addClass("is-scroll");
14      } else {
15        $(this).removeClass("is-scroll");
16        $(".c-open_navi").removeClass("is-scroll");
17        $("body").removeClass("is-scroll");
18      }
19    });
20  });
21
22  // --------------------------------------------------
23  // [SP] header menu - switch
24  // --------------------------------------------------
25  $(function(){
26    let state = false;
27    var navBody = $('body');
28    var navBox = $('.js-header__menu');
29    var navBtn = $('.js-header__menu_btn');
30    $(navBtn).on("click", function () {
31      if(state == false) {
32        navBody.toggleClass("is-fixed");
33        navBox.toggleClass("is-open");
34        navBtn.toggleClass("is-menuActive");
35        state = true;
36      } else {
37        navBody.toggleClass("is-fixed");
38        navBox.toggleClass("is-open");
39        navBtn.toggleClass("is-menuActive");
40        state = false;
41      }
42    });
43  });
44
45  // --------------------------------------------------
46  // common - スムーススクロール
47  // --------------------------------------------------
48  var headerHight = 70;
49  jQuery('a[href*="#"]').click(function(){
50    var href= jQuery(this).attr("href");
51      var target = jQuery(href == "#" || href == "" ? 'html' : href);
52       var position = target.offset().top-headerHight;
53    jQuery("html, body").animate({scrollTop:position}, 550, "swing");
54       return false;
55  });
56
57  // --------------------------------------------------
58  // common - page top
59  // --------------------------------------------------
60  $('.c-page_top').css("opacity","0");
61  $(window).scroll(function (){
62      $(".c-page_top").each(function(){
63          var Position = $(this).offset().top;
64          var scroll = $(window).scrollTop();
65          var windowHeight = $(window).height();
66          if (scroll >= 450 ){
67              $(".c-page_top").css("opacity","1" ).css("visibility","visible" );
68          } else {
69              $(".c-page_top").css("opacity","0" ).css("visibility","hidden" );
70          }
71      });
72  });
73
74  // --------------------------------------------------
75  // js - inview
76  // --------------------------------------------------
77  $(".js-inview").on("inview", function (event, isInView) {
78    if (isInView) {
79      $(this).stop().addClass("is-show");
80    }
81  });
82
83  // --------------------------------------------------
84  // js - MV text effect
85  // --------------------------------------------------
86  function EachTextAnimeControl() {
87    $('.c-mv__catchcopy').each(function () {
88      var elemPos = $(this).offset().top - 50;
89      var scroll = $(window).scrollTop();
90      var windowHeight = $(window).height();
91      if (scroll >= elemPos - windowHeight) {
92        $(this).addClass("is-active");
93      } else {
94        $(this).removeClass("is-active");
95      }
96    });
97  }
98  $(window).scroll(function () {
99    EachTextAnimeControl();
100  });
101  $(window).on('load', function () {
102    var element = $(".c-mv__catchcopy");
103    element.each(function () {
104      var text = $(this).text();
105      var textbox = "";
106      text.split('').forEach(function (t, i) {
107        if (t !== " ") {
108          if (i < 10) {
109            textbox += '<span style="animation-delay:.' + i + 's;">' + t + '</span>';
110          } else {
111            var n = i / 10;
112            textbox += '<span style="animation-delay:' + n + 's;">' + t + '</span>';
113          }
114
115        } else {
116          textbox += t;
117        }
118      });
119      $(this).html(textbox);
120    });
121    EachTextAnimeControl();
122  });
123
124  // --------------------------------------------------
125  // PC or SP
126  // --------------------------------------------------
127  function checkBreakPoint() {
128    var x = $(window).width();
129    var y = 760; //breakpoint
130    if (x <= y) {
131
132
133    } else {
134
135        // --------------------------------------------------
136        // [PC] header menu - hover color
137        // --------------------------------------------------
138        $(function () {
139          $(".js-headerMenuBox").hover (
140            function () {
141              $(this).prev(".js-headerMenuTitle").addClass("is-active");
142            },
143            function () {
144              $(this).prev(".js-headerMenuTitle").removeClass("is-active");
145            }
146          );
147        });
148
149    }
150  };
151  // ウインドウがリサイズする度にチェック
152  $(window).resize(function(){
153    checkBreakPoint();
154  });
155  // 初回チェック
156  checkBreakPoint();
157
158}

158);