質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.47%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

スライダー

GUIのグラフィカルウィジェットのひとつです。インジケーターを動かすことで値を調節可能とします。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

6019閲覧

swiper.jsで1枚目のスライダーだけスピードを変えたいのですが、方法がわかりません。

退会済みユーザー

退会済みユーザー

総合スコア0

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

スライダー

GUIのグラフィカルウィジェットのひとつです。インジケーターを動かすことで値を調節可能とします。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2019/12/07 12:30

クライアントワークでswiper.jsを使用しているのですが、1枚目のスライダーのスピードだけ変えたいという要望がありました。
色々と調べてみたのですが、主だった記事が見当たらなかったので、こちらの方達なら技術力が高いと思い質問させていただきました。

現在記述しているコードは以下になります。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="https://unpkg.com/swiper/js/swiper.js"></script> var swiper = new Swiper('.swiper-container', { autoplay: { delay: 6000, disableOnInteraction: false, stopOnLastSlide: true, }, effect: 'fade', speed: 2000, });

大元のswiper.jsはこちらになります。
https://swiperjs.com/

もしお分かりになられる方いらっしゃいましたらお力添えをいただけますと幸いです。
なお、slick.jsだと実験して解決している方がいらっしゃったので、参考に添付させていただきます。
[参考記事] https://www.6666666.jp/html/20170831/

ご検討のほどよろしくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

公式ドキュメントは調べられましたか? それらしいものが書いてありましたが。
Swiper API

Delay between transitions (in ms). If this parameter is not specified, auto play will be disabled

If you need to specify different delay for specific slides you can do it by using data-swiper-autoplay (in ms) attribute on slide:

JavaScript

<!-- hold this slide for 2 seconds --> <div class="swiper-slide" data-swiper-autoplay="2000"> ```

動作サンプル

一般的に、評価が高くよく使われているライブラリほど公式のドキュメントは充実しています。(因果は逆なのかもしれませんが)
今後色々調べる際はまず公式ドキュメントにあたられることをおすすめします。

投稿2019/12/07 16:35

shinji709

総合スコア805

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

shinji709

2019/12/07 17:01

なぜマイナス評価? ・間違っている回答 ・質問の回答になっていない投稿 ・スパムや攻撃的な表現を用いた投稿 どれでしょうか?
退会済みユーザー

退会済みユーザー

2019/12/07 18:07

早速コメントありがとうございました! そして教えていただいた方法でやってみたところできました! ありがとうございます。 英語があまり読めないのとできないと思っていたので、見つけることができずに初歩的な質問で申し訳ございませんでした! 今後は日本語翻訳など使ってくまなく調べてみます! 本当に助かりました! ベストアンサーにさせていただきます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問