slick CSSで無限ループにする方法

Question

前提・実現したいこと

slick css で写真のスライドショーを
左から右に写真を流れるスライドにできる様にしたのですが、最後の写真が終わると逆再生してしまいます。
逆再生しないで左から右へだけ永遠ループする追加cssコードをお教え頂きたいです。

発生している問題・エラーメッセージ

最後の写真で逆再生してしまいます

エラーメッセージ
なし

該当のソースコード

slick CSS
ソースコード
.slick-track{transition: transform 9999ms linear 0s !important;}

試したこと

知識がないので、ネットで検索していろいろコピペしてみましたが反応がなく困っています。

補足情報（FW/ツールのバージョンなど）

ワードプレスのプラグインでスライドショーは使っておりカスタムCSSで細かい設定ができる感じの状態です。

Comments

[kei344]

プラグイン／ライブラリは似た名前のものもあるため、取得した場所のURLを質問文に追記ください。（URLにはリンクを張ることができます）

Answer 1

$('.autoplay').slick({
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 2000,
});

これではないですか?

これは m.ts10806さんが書かれた Slick(本家サイト) に書かれています

ここに行って
使い方を確認なさってはいかがでしょう?

---

尚、提示されていた

.slick-track{transition: transform 9999ms linear 0s !important;} 

これは transform の transitionアニメーションを指定しているものですが
transitionは行って帰ってのアニメーションにしかなりません。

そもそも transform が使われてるとは思えませんが
万一使われている場合、悪影響しかないと思いますので
削除された方が良いかと思います。。。

Answer 2

皆様ご相談に乗って頂きありがとうございました。
試してみます。

Comments

[m.ts10806]

マルチポストは非推奨ですし「やむを得ず」してしまったときの対応もガイドラインで示されています。
https://teratail.com/help#posted-otherservice
要はこの「回答」ではどう解決したのかわかりません。
内容を調整してください

[kei344]

https://teratail.com/questions/history-reply/393146
コミュニティにて回答があったのであればそこのURLを提示しましょう。

[m.ts10806]

マルチポスト平気でする人でちゃんと対応する人っていないですね。
ほとんど自分だけ良ければいい人だ。

Answer 3

CSSの話ではないと思います。
Slickのドキュメント（settings）にあります。

 infinite
    type:boolean
    Default:true
	Infinite loop sliding

こちら試されたのでしょうか。
何も分からない状態で単にコピペで試しても動かないのは当然かと思います。

いずれにしても「試して動かなかったコード」も提示てください。
「なぜ動かないか」を突き詰めないことには本質的な解決に繋がらないと思います。
（あとドキュメントの使いかた）

Comments

[退会済みユーザー]

m.ts10806 さん
ご返信ありがとうございます。
なにぶん素人なのでよくわからないのですが
追加した画像のように、カスタムCSS欄に追加コードを記載してもできなくて
セッティングの中に上記コードを記載しないといけないと言うことでしょうか？

[m.ts10806]

CSSは見た目の話です。
「無限ループ」はプラグインの設定の話です。

[退会済みユーザー]

上記承知致しました。
操作方法の手順をお教え頂きたいのですが、可能でしょうか？

[m.ts10806]

ドキュメントに書いてある通りです。
オブジェクト形式でオプションを設定します。
(たぶん、これ理解しないとプラグインは使えないと思うし、ここでそこまで言及することではなく調べたら幾らでもでてくることです)

[kei344]

To: m.ts10806さん
「プラグイン」は「WordPressのプラグイン」を使った、ということなのでは。

[退会済みユーザー]

To: kei344さん
はい、まさにおっしゃる通りです。
その為に、自由度は低く、カスタムCSSに
少しコードを記載するだけで解決方法があればと思い
ご質者させて頂きました次第です。

[m.ts10806]

「jQueryプラグイン」と表記すべきでしたね。失礼しました。