日期:2013-6-20 来源:GBin1.com
如果你需要一款帮助你实现手机或者移动设备上内容幻灯实现的JS类库的话 , Swiper是一个不错的选择,它不依赖于任何第三方的类库。因此体积非常小,适合运行在移动设备上。拥有非常完整的自定义选项,并且支持很多不同的幻灯展示,在线演示非常全!
主要特性
- JS实现,不依赖于任何第三方的类库
- 支持触摸设备上的滑动(swipe)操作
- 支持水平和垂直的幻灯展示
- 支持多个元素的幻灯展示(类似carousel)
- 支持多种不同的自定义选项
- 支持无限滚动,拥有插入,添加新幻灯页面的API
- 支持Callback方法
- 支持桌面浏览器,支持使用鼠标来拖拽
via 极客标签
相关推荐
前端vue-awesome-swiper实现上下两级相互联动,绝对优秀!!!
1、使用HbuildX工具,引入uni-ui插件,使用uni-swiper-dot组件,开发轮播图 2、轮播图的三种mode:nav、dot、indexes
前段时间做Hybrid App,UI设计湿要求某一个页面的展示要实现滑动轮播效果,选中的内容卡片居中显示,上一个内容卡片和下一个内容以小一倍的大小显示在选中的卡片后头,而且要高斯模糊等等。。最骚的是滑动特效要是一...
一般做移动端轮播图的时候,最常用的就是Swiper插件了,而vue.js也有一个轮播组件vue-awesome-swiper,用法跟swiper相似。 1.安装vie-awesome-swiper nam install vue-awesome-swiper --save-dev 2.引用vie-awesome...
js-swiper-分页标签加进度条-自定义位置加进度条
它的作用是提供一种系统性的方法,以有效地应对挑战、优化流程或实现目标。以下是方案的主要作用: 问题解决: 方案的核心目标是解决问题。通过系统性的规划和执行,方案能够分析问题的根本原因,提供可行的解决...
本文实例为大家分享了vue使用swiper实现左右滑动切换图片的具体代码,供大家参考,具体内容如下 使用npm 安装vue-awesome-swiper npm install vue-awesome-swiper --save 在main.js中引用 import VueAwesomeSwiper...
swiper各种滑动demo,还有左右滑动中间嵌入上下滑动,代码简介,案例多,种类全,之后在我的博客里,也会有些swiper滑动使用得介绍(加入动画,左右滑动嵌入上下滑动)
ngx-swiper-wrapper, Swiper的Angular 包装库 Angular Swiper包装器 这是 Swiper的Angular 包装库。 要使用这个库,你也应该熟悉Swiper文档,因为这个文档只解释了这个包装器特有的细节。这里文档用于最新 6. x. ...
本文介绍了关于新版 vue-awesome-swiper,分享给大家,具体如下: 问题 为什么我的vue-awesome-swiper组件pagination小圆点不显示问题? 为什么我的vue-awesome-swiper不会自动播放? 为什么我的vue-awesome-...
vue.js触摸滑动组件
今天为大家推荐一款支持多种设备(移动端,平板,pc端)的滑块幻灯片插。我测试的是ie7.可以查看我的博客http://write.blog.csdn.net/postedit/46230475
轮播图
简单的滑动器/滑块。 在React-Native和React-Native-Web上均可使用。 演示版 混合小吃: : 安装 $ npm i react-native-web-swiper --save 用法 import React from 'react' ; import { StyleSheet , Text , View }...
说到h5的翻页,很定第一时间想到的是swiper。但是我当时想到的却是,vue里边怎么用swiper。这篇文章主要介绍了vue-awesome-swiper - 基于vue实现h5滑动翻页效果 ,需要的朋友可以参考下
微信小程序触摸内容滑动解决方案,API设计细节及命名参考于. 为什么要开发这款插件 官方swiper组件: 支持的事件回调很单一 从文档上看只是能支持横向滑动(官方swiper组件实际是支持纵向滚动的,设置属性vertical=...
该轮播图一屏显示三张图片,中间图片放大,两边图片缩小效果。基于swiper的完美轮播图,提供给大家参考!效果图参考:https://blog.csdn.net/qq_20757489/article/details/101024851
swiper圆角卡片式手机触屏滑动图片切换代码,一款基于swiper制作的手机端图片缩放展示效果,除了手指触屏滑动切换方式,还可以点击索引按钮进行切换。
npm install --save react-native-card-stack-swiper 预习 import CardStack , { Card } from 'react-native-card-stack-swiper' ; < CardStack xss=removed xss=removed xss=removed> { this . swiper = swiper ...
定时器实现无缝轮播图-swiper