1.插件要求的css样式:

<style>
.swipe {
overflow: hidden;
visibility: hidden;
position: relative;
}
.swipe-wrap {
overflow: hidden;
position: relative;
}
.swipe-wrap > li {
float:left;
width:100%;
position: relative;
}

</style>

2.JS代码:

<script>
var el = document.querySelector('.view');
var mySwipe = Swipe(el, {
startSlide: 6,
auto: 2000,
callback: function(key, el) {

},
transitionEnd: function(index, elem) {
console.log(index, elem);
}
});
</script>

swipe.js 使用方法的更多相关文章

  1. swipe.js 2.0 轻量级框架实现mobile web 左右滑动

    属性总结笔记如下: <style> .swipe { overflow: hidden; //隐藏溢出 清楚浮动 visibility: hidden; //规定元素不可见 (可以设置,当 ...

  2. Swipe JS – 移动WEB页面内容触摸滑动类库

    想必做移动前端的同学经常会接到这样子的一个需求,就是在移动设备页面上的banner图能够用手指触摸左右或上下的滑动切换,这在移动设备是个很常见的一个效果,其用户体验远甚于点击一个按钮区域,通过手指的触 ...

  3. 基于zepto使用swipe.js制作轮播图demo

    在移动web开发中,由于手机界面较小,为了能展示更多的图片经常使用轮播图并且还需要考虑到手机流量的问题,通过请教他人以及百度,个人感觉swipe.js比较好用 它是一个纯javascript工具,不需 ...

  4. Swipe-移动端触摸滑动插件swipe.js

    原文链接:http://caibaojian.com/swipe.html 插件特色 viaswipe.JS是一个比较有名的触摸滑动插件,它能够处理内容滑动,支持自定义选项,你可以让它自动滚动,控制滚 ...

  5. js调用php和php调用js的方法举例

    js调用php和php调用js的方法举例1 JS方式调用PHP文件并取得php中的值 举一个简单的例子来说明: 如在页面a.html中用下面这句调用: <script type="te ...

  6. 通过cookie实现搜索框内容保存关闭浏览器之前的操作、jq js实现方法

    jq实现的方法: jq需要在页面中引入JQ.cookie插件 这是一个超轻量级插件 要实现的效果: 下面是jq代码: $(function(){ var til=$("#orderInfoC ...

  7. jquery.validate.min.js 用法方法示例

    页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  8. jQuery 互相调用iframe页面中js的方法

    1,子iframe内调用父类函数方法: window.parent.func(); 2,子Iframe中获取父界面的元素: $("#xx", window.parent.docum ...

  9. JS扩展方法——字符串trim()

    转自:http://www.cnblogs.com/kissdodog/p/3386480.html <head> <title>测试JS扩展方法</title> ...

随机推荐

  1. CentOS+Apache虚拟主机域名设置

    首先注释掉 DocumentRoot /var/www/html     <virtualhost 192.168.1.105>     DocumentRoot /home/wxwb   ...

  2. oracle 归档日志总结

    Oracle 归档模式和非归档模式 归档模式和非归档模式 在DBA部署数据库之初,必须要做出的最重要决定之一就是选择归档模式(ARCHIVELOG)或者非 归档模式(NOARCHIVELOG )下运行 ...

  3. C语言的第一次实验报告

    一.实验题目,设计思路,实现方法 第四次 分支+循环 加强版 (4.2.7 装睡) 设计思路:由题意可知通过最初输入量判断循环次数,根据输出形式可知在每次循环中需重新定义输入量并判断其是否满足题中条件 ...

  4. mysql5.6.23安装 步骤

    1. 准备好配置文件 my.cnf 2.建立my.cnf中用到的必要的目录 3.在mysql目录下有个scripts/mysql_install_db, 执行: scripts/mysql_insta ...

  5. TCL基本语法

    所有的Tcl文件都以.tcl为扩展名. #!/usr/bin/tclsh puts "Hello, World!" TCL,我们使用新的行或分号终止代码前行.但分号不是必要的,如果 ...

  6. 利用spring的ApplicationListener实现springmvc容器的初始化加载

    1.我们在使用springmvc进行配置的时候一般初始化都是在web.xml里面进行的,但是自己在使用的时候经常会测试一些数据,这样就只有加载spring-mvc.xml的配置文件来实现.为了更方便的 ...

  7. C细节学习

    字符串ascii码值比较compress函数;

  8. Cordova+Vue构建Hybrid APP简易实操

    当下APP市场,因为Native APP开发成本高,Web APP不稳定,混合开发APP大行其道,成为越来越多开发者的首选.Hybrid APP开发框架也比较多,Weex.Ionic.PhoneGap ...

  9. Nginx 系统维护配置

    转自:http://blog.csdn.net/kkgbn/article/details/52153383 tomcat关闭后 请求返回502状态码 error_page /.html; locat ...

  10. SC命令安装window服务

    sc create Styler binpath= "D:\Styler\Styler.exe" start= auto displayname= "Styler&quo ...