Swiper使用方法

1.首先載入外掛程式，需要用到的檔案有swiper.min.js和swiper.min.css檔案。

...rel="stylesheet"
href="path/to/
swiper.min.css

">
head>
...src="path/to/
swiper.min.js

">
script>
body>
html>

...rel="stylesheet"
href="path/to/
swiper.min.css

">
head>
...src="path/to/
jquery.js

">
script>
src="path/to/
swiper.jquery.min.js

">
script>
body>
html>

class="swiper-container">

class="swiper-slide">slide 1div>
class="swiper-slide">slide 2div>
class="swiper-slide">slide 3div>
div>
class="swiper-pagination">
div>
class="swiper-button-prev">
div>
class="swiper-button-next">
div>
class="swiper-scrollbar">
div>
div>
導航等元件可以放在container之外

.swiper-container

var myswiper = new swiper ('.swiper-container', )        
script>
body>

Swiper教程 使用方法

本文為 h5edu 機構官方 html5培訓 教程，主要介紹 swiper教程 使用方法 swiper使用方法 1.首先載入外掛程式，需要用到的檔案有swiper.min.js和swiper.min.css檔案。如果你的頁面載入了jquery.js或者zepto.js，你可以選擇使用更輕便的swip...

Swiper教程 使用方法

swiper使用方法 1.首先載入外掛程式，需要用到的檔案有swiper.min.js和swiper.min.css檔案。如果你的頁面載入了jquery.js或者zepto.js，你可以選擇使用更輕便的swiper.jquery.min.js。2.html內容。slide 2 slide 3 導航等...

Swiper5 使用方法

doctype html html head link rel stylesheet href dist css swiper.min.css head body script src dist js swiper.min.js script body html 2.html內容。slide 2 s...