zoukankan      html  css  js  c++  java
  • 移动端开发(四):swiper.js

    swiper.js中文网:http://www.swiper.com.cn/

    文档结构

    swiper.jquery.js    是需要引用jquery.js 或者 zepto.js 时,只需直接引用该文件即可,减少加载。

    swiper.animate.js  使用animate.js的动画效果,使用方法:http://www.swiper.com.cn/usage/animate/index.html

    基本使用方法

    具体操作:http://www.swiper.com.cn/usage/index.html

    1. 写基本html标签结构,结构中使用swiper.js的className;

    2.书写js时,可直接调用某功能,但是前提必须是具有该功能的html标签存在在页面中;

    3.使用swiper.js的样式,需应用swiper.css

    API swiper.js版本3.0+  

    具体API:http://www.swiper.com.cn/api/start/2014/1218/140.html

     1.初始化

    var mySwiper = new Swiper('.swiper-contain',{
       autoplay: 3000, // 自动滑动 
    })

    2. Basic (swiper一般选项)

    主要包含:初始设置,滑动方向,速度,自动播放,视差效果,隐藏显示时的尺寸应用等。

    3. Progress (进度)

    标识silde的索引

    4. Free Mode(free模式/抵抗反弹)

    是否实现自动贴合,贴合期间的各个效果

    5. Slide grid(网格分布)

    properties 属性

  • 相关阅读:
    Go:获取命令行参数
    Go:文件操作
    Go:类型断言
    GO:interface
    Go:面向"对象"
    Go:工厂模式
    layui中流加载layui.flow
    js显示当前时间
    layui中的分页laypage
    layui中的多图上传
  • 原文地址:https://www.cnblogs.com/dongcheck/p/5062808.html
Copyright © 2011-2022 走看看