Swiper 在IE9 及其他浏览器使用
Swiper 在IE9 及其他浏览器使用
前言
昨天遇到一个问题,swiper 使用版本是3.4.2 除了Ie9浏览器外其他浏览器都正常,IE9 无法轮播,执行控制台报错源码问题。没办法,只能降级兼容了~
- html 模板引入swiper 相关的js 和 css 文件
<!--[if lt IE 9]>
IE9及以下放这里
<link href="../swiper2.7.6.css" rel=stylesheet>
<script type=text/javascript src="../swiper2.7.6.js"></script>
<!--[else]>
其他的放这里
<link href="../swiper3.4.2.css" rel=stylesheet>
<script type=text/javascript src="../swiper3.4.2.js"></script>
<![endif]-->
- js 文件里面也要判断兼容
- 注意 控制轮播方向的属性2 和 3 的不一样
const isIe9 = navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.split(";")[1].replace(/[ ]/g, "") == "MSIE9.0";
if(isIe9){
new Swiper('#swiper-container',{
loop:true,
mode:"vertical",// 注意这里 swiper2.7.6 控制轮播方向的是mode
autoplay:1500,
})
} else{
new Swiper('#swiper-container',{
loop:true,
direction:"vertical",
autoplay:1500
})
}
- 还遇到个问题就是 swiper2 版本不支持 设置 prevButton 和 nextButton 属性,其他的问题暂时没发现~
有其他的问题欢迎留言讨论
Swiper 在IE9 及其他浏览器使用的更多相关文章
- 让 IE9 以下的浏览器支持 Media Queries
1. 如何让 IE9 以下的浏览器支持 css3 的media query 需要用到的 min-width/max-width 属性 css3 的媒体查询 IE 浏览器的支持程度是从 IE9开始支持, ...
- IE9 以下版本浏览器兼容HTML5的方法,使用百度静态资源的html5shiv包
<!--[if lt IE9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.j ...
- swiper轮播在ie浏览器上遇到的显示问题探索
前言: 最近项目有一个需求,想要下图效果,鼠标指向头像图片,图片会放大同时上面的轮播会跟着切换: 鼠标移开头像图片,图片变回原来的大小 注:下图是我根据上面需求已经实现的效果,所以截图方便说明 思考: ...
- jquery ajax在跨域访问post请求的时候,包括ie9以下的浏览器无效,其他浏览器正常
最近做的一个项目,原先没有要求兼容IE9以下,所以在写代码的时候也没有打开IE9以下去测试,这两天要去做IE9以下的兼容,在IE9以下打开本地的项目发现数据请求不成功,而通过发布道服务器上的链接打开是 ...
- IT兄弟连 HTML5教程 设置IE9以下版本浏览器支持HTML5
HTML2.HTML5刚发布时由于各浏览器之间的标准不统一,开发者的时间都浪费在解决Web浏览器之间的兼容性上.但由于W3C和WHATWG对HTML5新版本的制定,以及近年来对HTML5的使用,再加上 ...
- loadrunner11录制脚本打开IE9失败,浏览器崩溃,显示无法响应
解决办法:工具-->Internet选项-->高级-->禁止ie启用第三方浏览器扩展
- IE9以下版本浏览器对HTML5新增标签不识别,导致CSS不起作用的问题
使用Javascript来使不支持HTML5的浏览器支持HTML标签.目前大多网站采用的这种方式(Bootcss官方例子也是如此). 在<head></head>标签内添加 2 ...
- 清除IE8/IE9/IE10/IE11浏览器缓存文件 100%有效
不管你是哪个版本的IE浏览器,按照下面指示操作,都能清除掉你使用浑身解数也清不掉的缓存文件! 第一步,打开IE浏览器——工具——Internet选项 有的IE浏览器的Internet选项藏在右上角一个 ...
- ie9以下的浏览器兼容性问题
.bind不兼容的问题Function.prototype.bind = function () { var fn = this, args = Array.prototype.slice.call( ...
随机推荐
- html+css知识点以及常见的坑
float 与 绝对定位 共同点:都脱离文档流,不占用原来的位置,后面的内容占有位置 不同点: float后者居上,补齐,且只能在父级盒子内活动,且不能浮动在照片上. 绝对定位脱离文档流后,直接漂浮到 ...
- 结对作业:四则运算(Java+JavaFX)
一.简介 此程序是一个可自动生成,计算小学四则运算题目的项目. Github地址:https://github.com/czmDeRepository/SoftwareWork/tree/master ...
- 牛客网PAT练习场-有几个PAT
题目地址:https://www.nowcoder.com/pat/6/problem/4066 题意:求pat->求pa->求p /** * *作者:YCute *时间:2019-12- ...
- 玩转Spring——Spring事务
事务的概念:多个sql 操作 要么都成功 要么都失败 ACID特性:原子性(Atomicity)原子性是指事务是一个不可分割的工作单位,事务中的操作要么都发生,要么都不发生.一致性(Consisten ...
- Docker 最常用的镜像命令和容器命令
本文列出了 Docker 使用过程中最常用的镜像命令和容器命令,以及教大家如何操作容器数据卷,实现容器数据的备份.熟练练习这些命令以后,再来一些简单的应用部署练习,大家就可以学习 Docker 的镜像 ...
- 【Android】AndroidStudio(Eclipse)如何使用天天模拟器进行调试apk应用。
作者:程序员小冰,GitHub主页:https://github.com/QQ986945193 新浪微博:http://weibo.com/mcxiaobing 大家都知道,我们这些Android开 ...
- P4719 【模板】"动态 DP"&动态树分治
题目描述 给定一棵 n 个点的树,点带点权. 有 m 次操作,每次操作给定 x,y,表示修改点 x 的权值为 y. 你需要在每次操作之后求出这棵树的最大权独立集的权值大小. 输入格式 第一行有两个整数 ...
- Unity插件介绍——Odin
今天把玩了一款最近的热门插件——“Odin - Inspector and Serializer”,其功能强大到让人无语,简直是开发利器,屠龙宝刀!它的功能是扩展Inspector显示,它重写和增加了 ...
- OC基础--字符串
前言 做iOS开发有3年了,从当初的小白到现在,断断续续看过很多资料,之前也写过一些博文来记录,但是感觉知识点都比较凌乱.所以最近准备抽时间把iOS开发的相关知识进行一个梳理,主要分为OC基础.UI控 ...
- 当年偶然发现的 Java Bug(JDK 9及之前仍未修复)
背景 15年在中信银行做持续集成时,由于当时的项目是基于三方采购的 Java 配置开发平台做的,平台自己基于 Ant 插件实现了增量和热部署. 其中有几个项目在持续集成部署时,经常发现 Linux 平 ...