https://www.ogis-ri.co.jp/_asset/top/js/top.js?20260918143509

1(function($) {
2  'use strict';
3
4  let slidelength = $(".p-mv-item").length;
5
6  let topIndex = {
7    "mv": slidelength - 1,
8    "tab": 2
9  };
10
11  $().ready(function () {
12    // $('.p-mv-thumb').slick({
13    //   slidesToShow: 5,
14    //   focusOnSelect: true,
15    //   asNavFor: '.p-mv-slider',
16    //   responsive:[
17    //     {
18    //       breakpoint: 600,
19    //       settings:{
20    //         slidesToShow: 3,
21    //         centerMode: true,
22    //       }
23    //     }
24    //   ]
25    // });
26
27    $('.p-special-slider').slick({
28      centerMode: true,
29      slidesToShow: 5,
30      arrows: true,
31      prevArrow: '<button type="button" class="c-slick-prev-btn"><img class="c-slick-arrow" src="/_asset/_common/img/icon-arrow.png" /></button>',
32      nextArrow: '<button type="button" class="c-slick-next-btn"><img class="c-slick-arrow" src="/_asset/_common/img/icon-arrow.png" /></button>',
33      variableWidth: true,
34      responsive:[
35        {
36          breakpoint: 1000,
37          settings:{
38            slidesToShow: 3
39          }
40        },
41        {
42          breakpoint: 600,
43          settings:{
44            slidesToShow: 1
45          }
46        }
47      ]
48    });
49
50    // ローカルストレージを取得
51    // 初期表示自動切り替えの停止はこの1行をコメントアウト
52    topIndex = getLocalStorage("topIndex",topIndex);
53
54    // それぞれインクリメント
55    // mv
56    if(topIndex.mv >= slidelength - 1) {
57      topIndex.mv = 0;
58    }else{
59      topIndex.mv++;
60    }
61    // tab
62    if(topIndex.tab >= 2) {
63      topIndex.tab = 0;
64    }else{
65      topIndex.tab++;
66    }
67
68    // ローカルストレージを保存
69    setLocalStorage("topIndex",topIndex);
70
71    initMvSlick();
72    initNewsTabs();
73
74    // news-tab
75    $(".p-news-tabs a").on("click",function(){
76      let target = $(this).attr("href");
77      $(".p-news-tabs a").removeClass("is-active");
78      $(".p-news-item").hide();
79
80      $(this).addClass("is-active");
81      $(target).show();
82      return false;
83    })
84
85    function initMvSlick() {
86      $(".p-mv-slider").on("init", function () {
87        $(`.slick-slide[data-slick-index="${topIndex.mv}"]`).addClass("add-animation");
88      }).slick({
89        autoplay: true,
90        autoplaySpeed: 7000, // インターバル時間
91        speed: 500, // アニメーション時間
92        dots: true,
93        arrows: true,
94        fade: true,
95        infinite: true,
96        initialSlide: topIndex.mv,
97        pauseOnFocus: false,
98        pauseOnHover: false,
99        pauseOnDotsHover: false,
100        prevArrow: '<button type="button" class="p-mv-slick-prev-btn">Prev</button>',
101        nextArrow: '<button type="button" class="p-mv-slick-next-btn">Next</button>',
102      }).on({
103        beforeChange: function (event, slick, currentSlide, nextSlide) {
104          $(".slick-slide", this).eq(nextSlide).addClass("add-animation");
105          $(".slick-slide", this).eq(currentSlide).addClass("remove-animation");
106        },afterChange: function () {
107          $(".remove-animation", this).removeClass("remove-animation add-animation");
108        },
109      });
110    }
111
112    function initNewsTabs() {
113      $(`.p-news-tabs li:nth-child(${topIndex.tab+1}) a`).addClass("is-active");
114      $(`.p-news .p-news-item:nth-child(${topIndex.tab+1})`).show();
115    }
116
117    // localStorageを取得
118    function getLocalStorage($key,$default) {
119      let $storage = localStorage.getItem($key);
120      if($storage) {
121        return JSON.parse($storage);
122      }else{
123        return $default;
124      }
125    };
126
127    // localStorageをセット
128    function setLocalStorage($key,$value) {
129      localStorage.setItem($key,JSON.stringify($value));
130    };
131
132
133  });
134})(jQuery)