The use of swiper (1)

swiper is a mobile page sliding framework. We can use this framework to write our own resume.

In addition to page sliding, swiper also provides a variety of other functional components for us to use.

And methods and callback functions.

We first implement a basic swiper page, a page with only page turning function.

First we need to reference the framework file. swiper.css and swiper.js

<link rel="stylesheet" href="swiper.css">
<script src="swiper.js"></script>

Create an external container. swiper-cotainer

<div class="swiper-container">

Then add an inner container to the outer container. swiper-wrapper

<div class="swiper-wrapper">

Add each flip page in the inner container

<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 class="swiper-slide>页面内容</div>
</div>
</div>

and then in Initialization in js

<script>
var swiper = new Swiper(&#39;.swiper-container&#39;);
</script>

The above is the content of using swiper (1). For more related content, please pay attention to the PHP Chinese website (www.php.cn)!