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

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

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

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

Q&A

解決済

1回答

1349閲覧

swiperのサムネイルを1枚の時は表示させない

buk

総合スコア53

jQuery

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

0グッド

0クリップ

投稿2022/07/25 09:42

<div class="swiper-container gallery-top slider1"> <div class="swiper-wrapper"> <div class="swiper-slide"><img src="images/slide001.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide002.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide003.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide004.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide005.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide006.jpg" alt=""/></div> </div> <!-- Add Arrows --> <div class="swiper-button-next swiper-button-white"></div> <div class="swiper-button-prev swiper-button-white"></div> </div> <div class="swiper-container gallery-thumbs slider1"> <div class="swiper-wrapper"> <div class="swiper-slide"><img src="images/slide001.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide002.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide003.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide004.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide005.jpg" alt=""/></div> <div class="swiper-slide"><img src="images/slide006.jpg" alt=""/></div> </div> </div>
var galleryThumbs1 = new Swiper('.gallery-thumbs.slider1', { spaceBetween: 10, slidesPerView: 5, freeMode: true, watchSlidesVisibility: true, watchSlidesProgress: true, }); var galleryTop = new Swiper('.gallery-top.slider1', { spaceBetween: 10, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, thumbs: { swiper: galleryThumbs1 } });

wordressで写真を追加させる予定です。

現在上記の記述でサムネイルが表示され問題なく実装しています。
しかし、1枚のだけ投稿された場合にはサムネイルは部分(.gallery-thumbs)は表示させないようにしたいのですが、記述方法がわかりません。

ご教授願います。

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

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

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

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

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

guest

回答1

0

ベストアンサー

if (document.querySelectorAll('.gallery-thumbs.slider1 .swiper-slide').length > 1) {などとして場合分けをしてはどうでしょうか?

投稿2022/07/26 08:50

Lhankor_Mhy

総合スコア37438

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.31%

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

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

質問する

関連した質問