项目使用Swiper4兼容小于IE11方案

最新推荐文章于 2023-05-26 10:33:12 发布
最新推荐文章于 2023-05-26 10:33:12 发布
阅读量1.1k 收藏
点赞数 1
分类专栏： 大前端 文章标签： 前端 html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_40599109/article/details/126916105
版权

原因：

  • 由于项目中使用了Swiper4，内部的css样式使用了display:flex ，不支持IE11之前的版本
    项目会在IE11之前的浏览器报Set未定义，导致项目中的很多功能失效

方案位置

/optimiz_u8/origin/pc/js/ieTipModal.js
optimiz_u8/origin/pc/css/ieTipModal.css

具体使用

1. <script src="https://ss.xgo-img.com.cn/pc/js/ieTipModal.js"></script>
2. <link rel="stylesheet" href="//ss.xgo-img.com.cn/pc/css/ieTipModal.css">
3. 在项目的html里面引入上面的css/js，在IE11之前浏览器打开会自动弹出弹窗
大唐荣华
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
swiper@4.5.1兼容ie
07-04
swiper@4.5.1兼容ie Swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。 Swiper能实现触屏焦点图、触屏Tab切换、触屏轮播图切换等常用效果。
react中使用swiper的具体方法
08-27
React中使用Swiper的具体方法是指在React项目中如何使用Swiper库来实现轮播图功能。Swiper是一个流行的轮播图库，能够帮助开发者快速实现轮播图功能。但是，在React项目中使用Swiper需要注意一些特殊的使用方法。 ...
swiper ie11版本兼容调整
m0_37246056的博客
10-16 3632
vue中使用swiper实现轮播图功能，package.json使用版本如下 "swiper": "^5.4.5", "vue-awesome-swiper": "^4.1.1", 在chrome中轮播图功能正常使用，是用ie11访问时，页面加载产生异常<SCRIPT1002: 语法错误> 参考ie 报 SCRIPT1002: 语法错误 将package.json中版本调整 "swiper": "^3.4.2", "vue-awesome-swip
swiper兼容IE
鱼儿哟
06-29 1万+
//引入资源文件 //HTML代码                                                                    slide1                                                    slide2
解决swiper在ie9以下不兼容问题
w36680130的博客
10-07 614
解决swiper在ie9以下不兼容问题
Vue 使用swiper4导致ie或手机浏览器打开空白的问题
weixin_34393428的博客
09-15 579
from:https://segmentfault.com/a/1190000015831092在ie下发现就是swiper的不兼容，一加上去ie就不显示了。结果是swiper版本的问题，最新的swiper4在ie中显示就是会出问题，将版本降到3.4.2就可以显示了。同时注意swiper3和4的定义方式以及一些方法有些不一样，要做一些改动。npm install --save-dev swi...
swiper轮播图如何兼容IE
weixin_59749798的博客
05-26 677
一般做IE的兼容我用的都是swiper2版本的，大部分游览器和IE都可以使用。但是当我切换到IE10，IE11测试的时候，发现轮播到第二张图片的时候就会停止，从网上也找不到有效的方法。之后去官网看了下，发现官网的demo切换到IE10+也会出现这样的情况，当然把autoplay切换时间切换为true的话可以循环一次，无限循环失效。查资料后感觉最好的方法就是下载两个swiper，一个版本2一个版本4.。swiper2兼容IE8,IE9和其他的游览器！swiper4则是可兼容IE10+之上的！
Angular6中使用Swiper的方法示例
08-27
Angular6 中使用 Swiper 的方法示例是指在 Angular6 项目中使用 Swiper 库来实现滑块效果的方法。本文将详细介绍 Angular6 中使用 Swiper 的方法示例，以供大家学习和参考。 Swiper 库简介 Swiper 是一个流行的...
vue2.0使用swiper组件实现轮播效果
12-29
1、安装swiper npm install swiper@3.4.1 --save-dev 2、引用组件 import Swiper from 'swiper'; import 'swiper/dist/css/swiper.min.css'; 3、html页面代码 <div class=swiper-container id=swiper> ...
Vue框架里使用Swiper的方法示例
10-18
下面我们将详细探讨如何在Vue项目中集成和使用Swiper。 首先，你需要通过npm或cnpm来安装Swiper库： ```bash cnpm install swiper ``` 安装完成后，你需要在你的Vue组件中导入Swiper及其样式文件： ```...
swiper在ie浏览器下不能兼容。
热门推荐
之度的博客
01-15 1万+
最近在做一个轮播的效果。找到了swiper这个插件。在移动端用着挺好的。但是在PC端的话，IE下效果全部失效。后来了解到，swiper3是专门针对移动端写的。如果想兼容IE8的话，应该引入swiper2.  参考网址http://www.qdfuns.com/notes/24424/fae71714914ba2e9a7c1e0aac5784df7.html
IE11兼容
u014717791的博客
09-13 635
本人小白，最近在重构vue项目，记录下ie兼容问题 项目package.json： babel.config.js如下 开发环境下IE浏览器一片空白。 查找了好多资料，都是安装babel-profill或者promise,我挨个测了都没效果， 因此从根本性每个组件一个一个测，最后发现是我安装第三方插件swiper导致IE控制台报错， 如上图我安装的是swiper@5.x版本的，估计是ie暂时不兼容这个版本的swiper， 于是我卸载了它，安装vue-awesome-sw...
swiper 和 vue-awesome-swiper 兼容问题 ios9系统下页面白屏问题
会飞的程序猿
10-14 465
【代码】swiper 和 vue-awesome-swiper 兼容问题 ios9系统下页面白屏问题。
vue-cli使用swiper4在ie以及safari报错
weixin_39037804的博客
10-13 390
vue-cli项目中，通过npm run swiper --save-dev安装的是swiper4版本的插件，这样安装以后在谷歌火狐等浏览器都可以正常运行，但是在safari浏览器（可能是版本太低）还...
swiper的兼容性（IE、chrome等）
weixin_43074269的博客
06-05 1万+
前几天在开发页面过程中，使用到的swiper插件做轮播图时，遇到了一些问题，chrome、360、QQ浏览器中都能正常显示，在IE10浏览器中显示正常，但是在IE9及以下不能使用。 原因：swiper插件适用于移动端，PC端上面有版本兼容问题，在IE9及以下，使用swiper2的任何版都可以，swiper2 还是很强大的；在IE10以上，以及其他的浏览器，swiper的版本都可以用。所以现在大家在...
swiper3.x和4.x华为浏览器的兼容性问题
quan的专栏
04-28 1067
在做电商网站的面料图与大图联动展示效果时，遇到了滑动面料图后点击一个面料，无法将大图滑动到指定面料的效果图。其中的面料图是ajax动态读取，使用myswiper.appendSlide(data.colorlist.split(','))方法添加，并没有使用myswiper.update()方法更新，导致部分华为机型（mate10、mate 20pro 、P20）的浏览器及微信下点击无法监听，但是...
解决swiper3.0版本在IE浏览器不兼容问题以及VUE箭头函数在IE浏览器里面不兼容
sunnyboysix的博客
08-08 5852
VUE箭头函数在IE浏览器不兼容 myArray.forEach(=&gt;{ ..................... }     把=&gt;改成function（xxx） IE不支持很多VUE的写法，自己可以参考一下ES6   swiper3.0版本在IE上兼容性很差的，公司最新的项目用了3.0的swiper在谷歌浏览器上OK，但是到了IE  9 10 11就没办法正常显...
vue3项目中swiper的使用
最新发布
04-18
在Vue 3项目中使用Swiper可以通过以下步骤进行： 1. 首先，你需要安装Swiper库。可以通过npm或者yarn来安装，命令如下： ``` npm install swiper ``` 或者 ``` yarn add swiper ``` 2. 在你的Vue组件中引入Swiper...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值