前端插件之-swiper
来源:互联网 发布:改视频的软件 编辑:程序博客网 时间:2024/05/16 12:55
swiper.min.css jquery.min.js swiper.jquery.min.js<div class="swiper-container">--首先定义一个容器 <div class="swiper-wrapper"> <div class="swiper-slide"><img src="" /></div> --添加图片 <div class="swiper-slide"><img src="" /></div> <div class="swiper-slide"><img src="" /></div> </div> <div class="swiper-pagination"></div>--小圆点分页器 <div class="swiper-button-prev"></div>--上一页 <div class="swiper-button-next"></div>--下一页 </div>var mySwiper = new Swiper(".swiper-container",{ autoplay:1000,--每秒中轮播一次 loop:true,--可以让图片循环轮播 autoplayDisableOnInteraction:false,--在点击之后可以继续实现轮播 pagination:".swiper-pagination",--让小圆点显示 paginationClickable:true,--实现小圆点点击 prevButton:".swiper-button-prev",--实现上一页的点击 nextButton:".swiper-button-next",--实现下一页的点击
effect:”flip”–可以实现3D效果的轮播
pagination: ‘.swiper-pagination’,
autoplay: 5000,
loop: true,
observer:true,//修改swiper自己或子元素时,自动初始化swiper
observeParents:true,//修改swiper的父元素时,自动初始化swiper
})
以及4个回调函数:
1.onTouchStart2.onTouchMove3.onTouchEnd4.onSlideSwitch。
阅读全文
0 0
- 前端插件之-swiper
- 自己动手丰衣足食之Swiper插件
- swiper插件
- Swiper 插件
- swiper插件
- swiper插件
- 前端开发之轮播图swiper的秒用
- 前端之插件-echats
- 前端之插件-fileinput
- 前端之插件-dynatree
- 前端之插件-ztree
- 前端之插件-mCustomScrollbar
- 前端之插件-layer
- Swiper 滑动插件
- swiper 插件应用!
- swiper.js插件使用
- 实用型插件-swiper
- vue引入swiper插件
- leetcode 230. Kth Smallest Element in a BST
- Java8 之 Lambda
- C++调用构造函数
- ZOJ 1119 SPF(割点)
- eclipse使用maven打包可执行的jar包
- 前端插件之-swiper
- 如何使用windows的计划任务?
- 透明三角的两种设置方式
- android 三方微信登录,分享 坑
- 合并两个有序链表
- curl语法
- 软件开发初级程序员 复
- JAVA篇_多线程零碎知识总结
- 如何编写单元测试