IE兼容swiper
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的更多相关文章
- Swiper说明&&API手册 【中文手册Swiper】
原文地址:http://www.cnblogs.com/scavengers/p/3760449.html 示例: <link rel="stylesheet" href= ...
- Swiper 中文API手册(share)
本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html ---------------------------华丽的分割线------------ ...
- Swiper.js 中文API手册
本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html ---------------------------华丽的分割线------------ ...
- Swiper说明&&API手册
最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...
- Swiper说明及API手册说明
最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...
- Swiper API
本文分享自 http://www.cnblogs.com/scavengers/p/3760449.html 最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎 ...
- Swiper Usage&&API
最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,请指出,多谢!如果想获得国外较多而全的文档,还是用google. 一了解SwiperSwiper 是一款免费以及轻 ...
- idangerous swiper
最近使用Swipe.js,发现中文的资料很少,试着翻译了一下.能力有限,翻译难免错漏,欢迎指出,多谢! 翻译自:http://www.idangero.us/sliders/swiper/api.ph ...
- swiper横向轮播(兼容IE8)
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
随机推荐
- IO 异常:The Network Adapter could not establish the connection 怎么解决
IO 异常:The Network Adapter could not establish the connection 怎么解决
- 如何用vue实现树形菜单?
在公司培训了2周,布置的作业是从树形,grid分页以及echarts中选一个.由于都不是很熟,就挑了第一个.本来想在网上找找参考,然后模仿着做一个,但是网上的代码多少参差不齐,写到一半没了,所以只要自 ...
- spring使用c3p0报错
java.sql.SQLException: Connections could not be acquired from the underlying database! at com.mchang ...
- scrapy_全站爬取
如何查询scrapy有哪些模版? scrapy genspider –list 如何创建crawl模版? scrapy genspider -t crawl 域名 scrapy genspider - ...
- 【转】nagios使用带url的check_http检测主机
前一段时间在Cu论坛发现一个提问,问题是nagios关于检测主机http服务的.原帖地址http://bbs.chinaunix.net /forum.php?mod=viewthread&t ...
- 什么是Servlet,Servlet的作用,生命周期,如何创建、配置Servlet
什么是Servlet,作用是? servlet是一个基于java技术的WEB组件,运行在服务器端,我们利用 sevlet可以很轻松的扩展WEB服务器的功能,使它满足特定的应用需要.servlet由se ...
- Jetson TX2刷机教程(原创)
Jetson TX2刷机教程 一,硬件准备 1台host主机(linux系统,最好是ubuntu64位) 1台Jetson TX2的平台 二,软件包 JetPack(Jetson SDK) 下载地址: ...
- 各模拟器adb连接端口
如果执行自动化测试,在没有真机的情况下,我们唯一的选择便是模拟器.目前市面上有很多模拟器,他们使用adb连接时都会有不同的默认接口,当adb无法自动连接模拟器时,手动使用ip+端口连接是很好的选择.下 ...
- oracle光标的使用
以下plsql程序用的scott用户的dept,emp表. 1.光标的使用: --查询并打印员工的姓名名和薪水 /* 光标属性: %found %notfound */ set serveroutpu ...
- SpringMVC环境搭建---xml版及注解版
一.建立 JavaWeb 项目(基于Intellij 14.0.3搭建) 1.建立一个 Java 项目,在项目下新建一个文件夹 webapp ,然后在该文件夹下新建一个 WEB-INF 文件夹: 2. ...