ホームページ > 記事 > ウェブフロントエンド > スワイパーの基本的な使い方(2)
前のセクションでは、スライド以外の機能を持たない基本的なスライド ページを実装しました。そのため、このセクションでは、ページに他の機能属性を追加します。
まず、前のレッスンの内容に従って、基本的なスワイパー ページを実装します。
次に、初期化された js コードに属性を追加します。
もちろん、ダウンロードしたフレームワークファイルを事前に引用することを忘れないでください。
まず、ページめくりナビゲーションの機能コンポーネントを追加します。
ページナビゲーションを外部コンテナに追加します。
<div class="swiper-Container"> <div class="swiper-wrapper"> <div class="swiper-slide">页面内容</div> <div class="swiper-slide">页面内容</div> <div class="swiper-slide">页面内容</div> <div class="swiper-slide">页面内容</div> <div class="swiper-slide">页面内容</div> </div> <div class="swiper-pagination"></div> //翻页导航的div </div> <script> var swiper = new Swiper('.swiper-container',{ pagination:'.swiper-pagination', //绑定翻页导航 paginationClickable:true //设定可以点击翻页导航进行翻页 }); </script>
これにより、ページめくりのナビゲーションがページに追加されます。
上記はスワイパーの基本的な使い方(2)です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) をご覧ください。