https://www.smd-am.co.jp/library/common/js/sw-top.js

1$(function () {
2
3  // タブ
4  $('#tabs a').click(function () {
5    // タブボタン
6    $("#tabs").find("a").removeClass("is-open");
7    $(this).toggleClass("is-open");
8
9    // 一覧
10    var target = $(this).attr("href");
11    var index = $(this).parent('li').index();
12    $('.m-tab-wrapper .tab').removeClass("is-open").removeClass("is-close").addClass('is-close');
13    $(target).removeClass('is-close').addClass("is-open");
14
15    // 下部のリンクボタン
16    $(this).parents('.m-news').find('.m-news-btn').hide().eq(index).show();
17    return false;
18  });
19  $('.tab').each(function (index, el) {
20    new SimpleBar(el);
21  });
22
23  // スライド
24  $("#mv").slick({
25    arrows: false,
26    dots: true,
27    autoplay: true,
28    autoplaySpeed: 4000,
29    speed: 2500,
30    fade: false,
31    pauseOnFocus: false,
32    pauseOnHover: false,
33    pauseOnDotsHover: false,
34    responsive: [{
35      breakpoint: 767,
36      settings: {
37        speed: 1000,
38      }
39    }]
40  });
41  var mvStop = $("#mvStop"),
42  mvPlay = $("#mvPlay"),
43  pmStop = $("#pmStop"),
44  pmPlay = $("#pmPlay"),
45  pmPrev = $("#pmPrev"),
46  pmNext = $("#pmNext");
47  mvStop.on('click', function () {
48    $('#mv').slick('slickPause');
49    $(this).toggleClass("is-active");
50    mvPlay.toggleClass("is-active");
51  });
52  //
53  mvPlay.on('click', function () {
54    $('#mv').slick('slickPlay');
55    $(this).toggleClass("is-active");
56    mvStop.toggleClass("is-active");
57  });
58
59  // カラム数を確認して、オプションを対応
60  var centerModeFlag = true
61  ,pcDotsFlag = true
62  ,spDotsFlag = true
63  ,spArrows = true;
64  var pickupMoviesItems = $('#pickupMovies li').length;
65  // 0件かつ公開なら削除タイトル部分も
66  if( pickupMoviesItems == 0 && (typeof pbPageEditParams == 'undefined' || pbPageEditParams['statusFlag'] != 1) ){
67    $('.m-pm-title').remove();
68  }
69  if( pickupMoviesItems <= 3 ){
70    centerModeFlag = false;
71    pcDotsFlag = false;
72  }
73  if( pickupMoviesItems <= 1 ){
74    spDotsFlag = false;
75    spArrows = false;
76  }
77
78  $("#pickupMovies").slick({
79    arrows: false,
80    dots: pcDotsFlag,
81    autoplay: true,
82    autoplaySpeed: 4000,
83    speed: 1000,
84    centerMode: centerModeFlag,
85    appendDots: $('.pm-Parts'),
86    slidesToShow: 3,
87    variableWidth: true,
88    centerPadding: '60px',
89    responsive: [{
90      breakpoint: 767,
91      settings: {
92        arrows: spArrows,
93        dots: spDotsFlag,
94        slidesToShow: 1,
95        variableWidth: false,
96        centerMode: true,
97        centerPadding: '0'
98      }
99    }]
100  });
101  pickupMoviesOperation();
102
103  pmStop.on('click', function () {
104    $('#pickupMovies').slick('slickPause');
105    $(this).toggleClass("is-active");
106    pmPlay.toggleClass("is-active");
107  });
108
109  pmPlay.on('click', function () {
110    $('#pickupMovies').slick('slickPlay');
111    $(this).toggleClass("is-active");
112    pmStop.toggleClass("is-active");
113  });
114  pmPrev.on('click', function () {
115    $('#pickupMovies').slick('slickPrev');
116  });
117  pmNext.on('click', function () {
118    $('#pickupMovies').slick('slickNext');
119  });
120
121  $(window).resize(pickupMoviesOperation);
122  // スライダーのarrow、
123  function pickupMoviesOperation(){
124    var windowWidth = $(window).width();
125    var slick = $('#pickupMovies').hasClass('slick-initialized');
126    if( windowWidth > 767){
127      // PC
128      if(pcDotsFlag){
129        $('.l-pickup .pm-Parts, .l-pickup .pm-Parts .playbtn').show();
130      }else{
131        $('.l-pickup .pm-Parts, .l-pickup .pm-Parts .playbtn').hide();
132      }
133    }else{
134      // SP
135      if(spDotsFlag){
136        $('.l-pickup .pm-Parts, .l-pickup .pm-Parts .playbtn').show();
137      }else{
138        $('.l-pickup .pm-Parts').show();
139        $('.l-pickup .pm-Parts .playbtn').hide();
140      }
141    }
142
143  }
144
145});