Framework7-swiper-slider
提供:Dev Guides
Framework7-スワイパースライダー
説明
スワイパースライダーは最も強力で最新のタッチスライダーであり、多くの機能を備えたFramework7に搭載されています。
次のHTMLレイアウトはスワイパースライダーを示しています-
次のクラスは、スワイパースライダーに使用されます-
- swiper-container -これはメインスライダーコンテナーに必要な要素であり、スライドおよびページ付けに使用されます。
- Swiper-wrapper -追加のラッパースライドに必要な要素です。
- swiper-slide -これは単一のスライド要素であり、内部に任意のHTMLを含めることができます。
- swiper-pagination -ページネーションの箇条書きではオプションであり、それらは自動的に作成されます。
あなたは、関連するメソッドを使用してJavaScriptでスワイパーを初期化することができます-
OR
両方のメソッドは、オプションでスライダーを初期化するために使用されます。
上記のメソッドには、次のパラメータが含まれています-
- swiperContainer -スワイパーコンテナの_HTMLElementまたはstring_であり、必須です。
- パラメータ-これらはスワイパーパラメータを持つオブジェクトを含むオプションの要素です。
たとえば-
スワイパーのインスタンスにアクセスすることが可能であり、スライダーのコンテナの_swiper_プロパティには次のHTML要素があります-
次の表でスワイパーのさまざまな方法と種類を見ることができます-
S.No | Swiper Types & Description |
---|---|
1 |
Default Swiper With Pagination これは最新のタッチスライダーであり、スワイパーはデフォルトで水平にスワイプします。 |
2 |
これはデフォルトのスワイパーとしても機能しますが、垂直にスワイプします。 |
3 |
このスワイパーは、2つのスライド間にスペースを与えるために使用されます。 |
4 |
このスワイパーは、1ページで複数のスワイパーを使用します。 |
5 |
これは、垂直スライドと水平スライドの組み合わせです。 |
6 |
カスタムコントロールがスライドを選択またはスワイプするために使用されます。 |
7 |
ロードに時間がかかるマルチメディアファイルに使用できます。 |