Basic use of swiper (2)

In the previous section, we implemented a basic sliding page, which has no function except sliding. So in this lesson, we will add other functional attributes to the page.

First implement a basic swiper page according to the content of the previous lesson.
Then add attributes to the initialized js code.

Of course, don’t forget to quote the downloaded framework file in advance.
We first add the functional component of page turning navigation.

Add page navigation to the external container.

<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(&#39;.swiper-container&#39;,{
pagination:&#39;.swiper-pagination&#39;,   //绑定翻页导航
paginationClickable:true        //设定可以点击翻页导航进行翻页
});
</script>

This adds a page navigation to the page.

The above is the basic use of swiper (2). For more related content, please pay attention to the PHP Chinese website (m.sbmmt.com)!