官网地址:(http://www.swiper.com.cn/)。

一、Swiper.js简介:

Swiper(前称Swiper master) 是一款免费以及轻量级的移动设备触控滑块的js框架,使用硬件加速过渡(如果该设备支持的话)。主要使用与移动端的网站、网页应用程序(web apps),以及原生的应用程序(native apps)。主要是为IOS而设计的,同时,在Android、WP8系统以及PC端的浏览器也有着良好的用户体验。

Swiper常用于移动端网站的内容触摸滑动

Swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。

Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。

Swiper开源、免费、稳定、使用简单、功能强大,是架构移动终端网站的重要选择!

更多的介绍可以去官网地址:http://www.swiper.com.cn/查看。

也可以戳这里查看demo:http://www.swiper.com.cn/demo/index.html#

二、Swiper.js的版本区别

1、Swiper.js 3.x的版本。其主要适用对象为手机、app、webapp等移动终端。Swiper.js 3.0版本所采用了比较多的html5与CSS3的新特性,因此对PC端的浏览器兼容性并不是非常好,尤其是IE。在IE9以下(IE10没有测试过),Swiper.js 几乎等同于没有用,一点效果都没有。因此Swiper.js 3.0最适合用于移动端。

2、Swiper.js 2.x版本。Swiper.js 2.x版本对PC端的浏览器兼容性比较好,甚至支持IE7。其中的滑动效果在IE8都可以完美的运行。

具体看demo:http://swiper2.swiper.com.cn/demo/index.html

三、Swiper.js 有趣的功能

1、使用过程中,觉得Swiper.js能整合强大的css3动画效果插件:animate.css,详情请戳:http://daneden.github.io/animate.css/。Swiper.js结合Animate.css可以实现强大的动画效果,几乎无所不能。如果Animate.css的动画效果你不满意,你完全可以自己添加动画,用起来简直太棒了。

关于Animate.css的详细教程已经有人写得非常详细了,这里也就不累赘重复写了,直接转载地址:

css3动画简介以及动画库animate.css的使用

Swiper.js使用教程的更多相关文章

  1. Swiper.js使用及API介绍

    Swiper.js详细使用教程http://www.swiper.com.cn/api/start/2014/1218/140.html

  2. js模版引擎handlebars.js实用教程——目录

    写在开头的话: 阅读本文需要了解基本的Handlebars.js概念,本文并不是Handlebars.js基础教程,而是注重于实际应用,为读者阐述使用过程中可能会遇到的一些问题. 实际上,小菜写这篇文 ...

  3. 24个很赞的 Node.js 免费教程和在线指南

    JavaScript 最初是用来创建动态网站效果的的前端语言.而如今,这门脚本语言也可以用作后端开发,用于搭建 Web 服务器,开发接口,甚至创建博客.在下面这个列表中包括24个 Node.js 教程 ...

  4. Google Analytics统计代码GA.JS中文教程

    2010-12-06 11:07:08|  分类: java编程 |  标签:google  analytics  ga  js  代码  |举报|字号 订阅     Google Analytics ...

  5. iScroll.js和swiper.js

    最近系统地学习了iScroll.js和swiper.js,感觉它们在移动端特别好用:http://www.360doc.com/content/14/0724/11/16276861_39669990 ...

  6. iScroll.js和Swiper.js联合使用时的插件冲突(滑动冲突)

                      上面的截图 ,是手机端的一个滑动刷新效果.用的是scroll.js插件. 每项中又有一个滑动,是左右滑动的用swiper.js插件,查看每个班级的信息. 当手从sw ...

  7. 【入门必备】最佳的 Node.js 学习教程和资料书籍

    Web 开发人员对 Node.js 的关注日益增多,更多的公司和开发者开始尝试使用 Node.js 来实现一些对实时性要求高,I/O密集型的业务.这篇文章中,我们整理了一批优秀的资源,你可以得到所有你 ...

  8. 【特别推荐】Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

  9. Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

随机推荐

  1. nodejs的某些api~(四)udp&dns

    今天记udp/数据报套接字和dns. udp UDP/数据报套接字 => require('dgram');dgram.createServer([type],[cb]);type:可以是'ud ...

  2. 牛客练习赛31 D神器大师泰兹瑞与威穆

    双链表搞完了 #include<bits/stdc++.h> using namespace std; #define maxn 1000005 int tot,bac[maxn],fa[ ...

  3. MVC aspx

    客户端服务器---Model(模型)---View(视图)---Control(控制器) 1.ASP.NET  MVC 2.新建项目引擎选aspx.在Controllers创建控制器,默认启动Home ...

  4. bzoj4566 找相同字符

    题意:给定两个字符串,从中各取一个子串使之相同,有多少种取法.允许本质相同. 解:建立广义后缀自动机,对于每个串,分别统计cnt,之后每个点的cnt乘起来.记得开long long #include ...

  5. axios 使用

    <!DOCTYPE html> <html lang="en"> <head> {#导入静态文件#} {% load static %} < ...

  6. Java programming problems

    1.使用循环把26个字母按字典顺序存入数组,在不使用另外数组的情况下将其逆序存放,在根据处理后的字符数组创建一个字符串并输出 public static void main(String[] args ...

  7. Python之函数的本质、闭包、装饰器

    函数名的本质 函数名本质上就是函数的内存地址. 1.可以赋值给其他变量,被引用 def func(): print('in func') f = func print(f) 2.可以被当作容器类型的元 ...

  8. 马士兵2string buffuer

    string不可变的字符序列 s1=s1+s2

  9. echart折线区域图

    在引入echart区域折线图时,没有出现对应的区域图 当发现引入下面代码到自己的代码中并没有对应的区域图 option = { xAxis: { type: 'category', boundaryG ...

  10. (链表) leetcode 328. Odd Even Linked List

    Given a singly linked list, group all odd nodes together followed by the even nodes. Please note her ...