スライダーを以前見たままの状態で別ページにjsで表示したい

Question

別ページにあるスライダーを、他ページで画像をクリックした際に以前見た状態のままスライダーをモーダルで再表示したい

<section id="section1" class="c-section">
      <ul class="c-section_slider">
         <li class="c-section_slider_list">
            <img src="https://www.pakutaso.com/shared/img/thumb/pakutaso-8195_TP_V1.jpg" alt="">
         </li>
         <li class="c-section_slider_list">
            <img src="https://www.pakutaso.com/shared/img/thumb/pakutaso-8195_TP_V1.jpg" alt="">
         </li>
         <li class="c-section_slider_list">
            <img src="https://www.pakutaso.com/shared/img/thumb/pakutaso-8195_TP_V1.jpg" alt="">
         </li>
      </ul>
</section>
<section id="section2" class="c-section">
   <p class="slider_arcive"><img src="https://www.pakutaso.com/shared/img/thumb/pakutaso-8195_TP_V1.jpg" alt=""></p>
</section>

$(function() {
  $('.c-section_slider').slick();
　$('.slider_arcive').on('click',function(){
     ・・・・・
  };
});

ここにより詳細な情報を記載してください。

c-section_sliderがスライダーです。プラグインのslickを利用しています。
http://kenwheeler.github.io/slick/

slider_arciveをクリックすると、c-section_sliderを以前見た状態のままモーダルで表示したいのですがやり方が全くわからずです。

初心者なのでかなりわかりづらいかもしれませんが、どなたかお分かりになる方ご協力お願いします。

Comments

[退会済みユーザー]

まず、使われてるスライダーの名前を教えてください。自作の場合は外部サービスにあげるかteratail上に記入してください。 すごく気になるんですが<js>とは？便宜上つけた名前でしょうか？

[Lhankor_Mhy]

『以前見た状態のまま』とは、具体的にはどういうことですか？　たとえば、スライダー画像1～3とあって、スライダー画像2が表示されている状態でページ移動した場合、モーダルでスライダー画像2がアクティブになっているスライダーを表示したい、のようなことでしょうか？

[a1291]

yoshi0819さん　JSのファイルという意味でつけました。わかりづらくすみません。

[a1291]

Lhankor_Mhyさん　わかりづらくすみません。そうですね、currentの状態で別ページに移動した際にそのカレント状態のまま表示したいということです。ありがとうございます。

[m.ts10806]

コードはマークダウンのcode機能を利用してください。質問は編集できるので適宜追記・編集してください

[a1291]

mts10806さん　失礼致しました。修正しました。よろしくお願いします。

Answer 1

slickCurrentSlideで、現在表示されているスライドの番号を取得できるようです。
そして、初期設定のinitialSlideで開始スライドを決めることができるようです。
なので、スライドの番号をcookieに保存したり、URLパラメータに含めたりすることで、対応が可能だと思います。

ご不明の点があれば、コメントでお知らせください。

Comments

[a1291]

お返事遅くなり申し訳ありません。調べたところ、slickGoToという指定のスライダー画像を表示できるオプションがありましたので、取得したスライド番号をそちらに当てはめてできそうです、ありがとうございました。