https://www.trans-cosmos.co.jp/js/component.js

1$(function(){
2  setAcc();
3  setAccFooter();
4  setMvSlider();
5  setCaseSlider();
6
7  $('.js-popup').on('click',function(){
8    if($(this).hasClass('open')) {
9      $(this).removeClass('open');
10    } else { 
11      $(this).addClass('open');
12    }
13  });
14
15});
16
17$(function() {
18    var topBtn = $('#go_top');
19    topBtn.hide();
20    $(window).scroll(function () {
21        if ($(this).scrollTop() > 200) {
22            topBtn.fadeIn();
23            //ブラウザ幅が767以下ならボタン表示
24            // var b = $(window).width();
25            // var a = 767;
26            // if (b <= a) {
27            //     //ボタンの表示方法
28            //     topBtn.fadeIn();
29            // } else{
30            //  //ブラウザ幅が767以上ならボタン非表示
31            //      topBtn.hide();
32            // }
33        } else {
34            topBtn.fadeOut();
35        }
36    });
37    topBtn.click(function () {
38        $('body,  html').animate({
39            scrollTop: 0
40        },   500);
41        return false;
42    });
43});
44
45/* --------------------------------------------------
46MV Slider
47-------------------------------------------------- */
48function setMvSlider() {
49  if($('.mv_slider').length > 0) {
50    $('.mv_slider').slick({
51      dots: true,
52      autoplay: true,
53      autoplaySpeed: 7000,
54      speed: 600,
55      fade: true,
56      cssEase: 'ease-in-out',
57      arrows: true,
58      pauseOnFocus: false,
59      pauseOnHover: false,
60      pauseOnDotsHover: false,
61      waitForAnimate: false,
62      prevArrow: '<span class="btn_prev"><img src="/images/component/arrow_prev.png" class="slide-arrow prev-arrow" alt="後"></span>',
63			nextArrow: '<span class="btn_next"><img src="/images/component/arrow_next.png" class="slide-arrow next-arrow" alt="前"></span>',
64      responsive: [
65        {
66          breakpoint: 768,
67          settings: {
68            arrows: false,
69          }
70        }
71      ]
72    });
73  }
74}
75/* --------------------------------------------------
76Case Slider
77-------------------------------------------------- */
78function setCaseSlider() {
79  if($('.case_slider').length > 0) {
80    $('.case_slider').slick({
81      dots: false,
82      infinite: true,
83			slidesToShow: 3,
84      prevArrow: '<span class="btn_prev"><img src="/images/component/slider_prev.svg" class="slide-arrow prev-arrow" alt="後"></span>',
85			nextArrow: '<span class="btn_next"><img src="/images/component/slider_next.svg" class="slide-arrow next-arrow" alt="前"></span>',
86      responsive: [{
87				breakpoint: 768,
88				settings: {
89          centerMode: true,
90          centerPadding: '28px',
91					slidesToShow: 1,
92          // infinite: false,
93          // prevArrow: '<span class="btn_prev"><img src="/images/component/slider_next.svg" class="slide-arrow prev-arrow" alt="後"></span>',
94			    // nextArrow: '<span class="btn_next"><img src="/images/component/slider_prev.svg" class="slide-arrow next-arrow" alt="前"></span>',
95				}
96			}]
97    });
98    
99    // $('.case_slider').on('beforeChange', function(event, slick , currentSlide, nextSlide){
100    //   var $prevBtn = $(this).find('.btn_prev'),
101    //       $nextBtn =  $(this).find('.btn_next');
102    //   if($(window).width() < 768) {
103    //     if(nextSlide != 0) $prevBtn.css('visibility', 'visible');
104    //     else $prevBtn.css('visibility', 'hidden');
105
106    //     if(nextSlide == slick.slideCount - 1) $nextBtn.css('visibility', 'hidden');
107    //     else $nextBtn.css('visibility', 'visible');
108    //   } else {
109    //     $prevBtn.removeAttr('style');
110    //     $nextBtn.removeAttr('style');
111    //   }
112    // });
113    console.log(1)
114    $(".case_slider .case_item").matchHeight();
115  }
116}
117/* --------------------------------------------------
118accordion
119-------------------------------------------------- */
120function setAcc(){
121  $('.js-acc').each(function(){
122    var $accCnt = $(this).find('.js-acc_content');
123
124    if($(this).hasClass('open')){
125      $accCnt.show();
126    }
127  });
128
129  $('body').on('click','.js-acc_trg', function(){
130    var $accArea = $(this).closest('.js-acc');
131    var $accCnt = $accArea.find('.js-acc_content');
132  
133    if($accArea.hasClass('open')){
134      $accCnt
135          .stop()
136          .slideUp();
137      $accArea
138          .removeClass('open');
139    }
140    else{
141      $accCnt
142          .stop()
143          .slideDown();
144      $accArea
145          .addClass('open');
146    }
147  });
148}
149/* --------------------------------------------------
150accordion footer
151-------------------------------------------------- */
152function setAccFooter() {
153  $(window).resize(function() {
154    if($(window).width() > 767) {
155      $('.ftr_acc_content').removeAttr('style');
156    }
157  });
158  $('.js-acc_footer').each(function(){
159    var $accCnt = $(this).find('.js-acc_content');
160
161    if($(this).hasClass('open')){
162      $accCnt.show();
163    }
164  });
165
166  $('body').on('click','.js-acc_trg_footer', function(){
167    var $accArea = $(this).closest('.js-acc_footer');
168    var $accCnt = $accArea.find('.js-acc_content');
169
170    if($accArea.hasClass('open')){
171      $accCnt
172          .stop()
173          .slideUp();
174      $accArea
175          .removeClass('open');
176    }
177    else{
178      $accCnt
179          .stop()
180          .slideDown();
181      $accArea
182          .addClass('open');
183    }
184  });
185}