swiper3能完美运用在移动端,但是运用在PC端,特别是IE浏览器上不能兼容,没有效果,要使IE兼容Swiper的话必须使用swiper2,也就是idangerous.swiper.js,

下载地址是http://2.swiper.com.cn/download/index.html#file1

但是swiper2的API与swiper3的不同,需要根据swiper2的API来具体运用。

例如分页器,

html

//swiper3

<div class=”swiper-pagination”></div>

//swiper2

<div class=’pagination’></div>

css

//swiper2

<style>

.pagination {

    position: absolute;

    z-index: 20;

    bottom: 10px;

    width: 100%;

    text-align: center;

}

.swiper-pagination-switch
{

    display: inline-block;

    width: 8px;

    height: 8px;

    border-radius: 8px;

    background: #555;

    margin: 0 5px;

    opacity: 0.8;

    border: 1px solid #fff;

    cursor: pointer;

}

.swiper-active-switch
{

    background: #fff;

}

</style>

//swiper3不需要定义css

js

<script>

var swiper= new Swiper(“.swiper-container”,{

//swiper3

pagination:’.swiper-pagination’

//swiper2

pagination:’.pagination’

})

</script>

IE兼容swiper的更多相关文章

  1. Swiper说明&&API手册 【中文手册Swiper】

     原文地址:http://www.cnblogs.com/scavengers/p/3760449.html 示例: <link rel="stylesheet" href= ...

  2. Swiper 中文API手册(share)

    本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html ---------------------------华丽的分割线------------ ...

  3. Swiper.js 中文API手册

    本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html ---------------------------华丽的分割线------------ ...

  4. Swiper说明&&API手册

    最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...

  5. Swiper说明及API手册说明

    最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...

  6. Swiper API

    本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html 最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎 ...

  7. Swiper Usage&&API

    最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,请指出,多谢!如果想获得国外较多而全的文档,还是用google. 一了解SwiperSwiper 是一款免费以及轻 ...

  8. idangerous swiper

    最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...

  9. swiper横向轮播(兼容IE8)

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. 用photoshop将图片四角变成圆角

    1.用PS打开一张图片,用矩形选框工具,选出你要保留的的那一部分,"选择→修改→平滑".在弹出的选框里添入数值,值越大角就越圆. 2.然后选择"选择→反选"再按 ...

  2. 我的java学习之路--Reflect专题

    学习网址:http://www.imooc.com/video/3725 1.Class类的使用 class类 在面向对象的世界里,万事万物皆对象 java语言中,静态的成员.普通数据类型类不是对象. ...

  3. Jade报错:Invalid indentation,you can use tabs or spaces but not both问题

    现象:通过html生成jade文件之后,更改jade文件时,语句没什么问题的情况下,jade文件编译不通过,报错:Invalid indentation,you can use tabs or spa ...

  4. pjax 笔记

    PJAX的基本思路是,用户点击一个链接,通过ajax更新页面变化的部分,然后使用HTML5的pushState修改浏览器的URL地址,这样有效地避免了整个页面的重新加载.如果浏览器不支持history ...

  5. C# 将Access中时间段条件查询的数据添加到ListView中

    C# 将Access中时间段条件查询的数据添加到ListView中 一.让ListView控件显示表头的方法 在窗体中添加ListView 空间,其属性中设置:View属性设置为:Detail,Col ...

  6. selenium+python自动化测试系列(一):登录

        最近接手商城的项目,针对后台测试,功能比较简单,但是流程比较繁多,涉及到前后台的交叉测试.在对整个项目进行第一轮测试完成之后,考虑以后回归测试任务比较重,为了减轻回归测试的工作量,所以考虑后台 ...

  7. Redis 2种持久化模式的缺陷

    http://blog.csdn.net/hexieshangwang/article/details/47254087 一.RDB持久化模式缺陷 1.问题描述: 并发200路,模拟不断写Redis, ...

  8. Git: 本地创建版本库用于多处同步

    问题背景 目前有一个 Android 和 一个 iOS 项目,两个项目底层使用相同的 C++ 代码.由于在开发迭代中代码时常更新,而且往往是今天 Android 部分修改一小部分,明天 iOS 部分修 ...

  9. Tomcat系统架构分析

    Tomcat系统架构分析 关于这边blog呢,实际开发中并不会用到,但是我觉得还是很有必要认真的写一下.毕竟我们每天在本地撸码的时候使用的就是tomcat来做web服务器.一个常识就是说我们本地在to ...

  10. org.json.JSONObject的optXXX方法

    JSONObject有很多optXXX方法,比如optBoolean,optString,optInt.... 他们的意思是:如果这个JSONObject对象,如果有返回这个属性的值,如果没有返回一个 ...