|
|
Swiper
| 应用插件: |
Swiper4.x |
| 分享方式: |
免费分享 |
| 创作方式: |
分享 |
| 图片展示: |
 |
<!DOCTYPE html><html><head> ... <link rel="stylesheet" href="path/to/swiper.min.css"></head><body> ... <script src="path/to/swiper.min.js"></script></body></html>
<div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide">Slide 1</div> <div class="swiper-slide">Slide 2</div> <div class="swiper-slide">Slide 3</div> </div> <!-- 如果需要分页器 --> <div class="swiper-pagination"></div> <!-- 如果需要导航按钮 --> <div class="swiper-button-prev"></div> <div class="swiper-button-next"></div> <!-- 如果需要滚动条 --> <div class="swiper-scrollbar"></div></div>
.swiper-container { width: 600px; height: 300px;}
<script> var mySwiper = new Swiper ('.swiper-container', { direction: 'vertical', loop: true, // 如果需要分页器 pagination: { el: '.swiper-pagination', }, // 如果需要前进后退按钮 navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, // 如果需要滚动条 scrollbar: { el: '.swiper-scrollbar', }, }) </script></body>
<script type="text/javascript">window.onload = function() { ...}</script>
<script type="text/javascript">$(document).ready(function () { ...})</script>
yao.xywy.com/ppyy/1796.htmlyao.xywy.com/ppyy/1801.html
|
|
发表于 2019-12-30 14:59:20
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
分享
淘帖