浅谈遇到的几个浏览器兼容性问题

2024-06-24 11:06:32阅读量：37 字体：大 中 小

背景

解决浏览器的兼容性问题是一件很烦的事情，其中并没有太多高深的技巧，但是开发需要，也不得不去解决它，最近在开发项目中也遇到一些兼容性的问题，希望把这些问题的解决方式记录下来，下次遇到就直接拿过来用，也希望对他人有一些帮助。

兼容性问题及解决方式

1.object-fit在ie11和edge中不兼容，可以一些css hacks

使用background-size和background-position替换object-fit设置图片的样式

浅谈遇到的几个浏览器兼容性问题

上述代码中可以修改为如下：

对于视频播放，object-fit:cover可以解决视频不会随着屏幕缩放的问题

可以使用如下css设置video标签，解决object-fit不兼容ie和edge的问题

2.window.onload事件会在图片等资源加载完成后执行方法，但是它不会检测视频资源是否加载完成，可以使用如下代码检测视频是否加载完成

3.css的transition执行完成后会触发transitionend事件，但是存在兼容性，可以使用下面代码解决浏览器间的兼容性

4.onwheel事件兼容性

5.wheel事件的wheelDelta和detail属性在不同浏览器下值不同，可以使用如下代码对其进行normalize

6.requestAnimationFrame兼容性

免责声明：

本文《浅谈遇到的几个浏览器兼容性问题》版权归原作者所有,内容不代表本站立场！

如本文内容影响到您的合法权益（含文章中内容、图片等），请及时联系本站，我们会及时删除处理。

推荐阅读

  • 抖音怎么看谁取消关注了我了

    抖音怎么看谁取消关注了我了

    抖音不能直接看谁取消关注你，但如果对方曾经与你是互相关注的话，就可以查看对方是否把你取关了。具体的操作方式如下： 抖音怎么看谁取消关注了我了 1、打开抖音，点击进入我”的界面。 2、进入...

    阅读: 1242

  • 苹果实况照片怎么弄到抖音上

    苹果实况照片怎么弄到抖音上

    实况照片是iPhone手机上的一种拍照模式，可以让拍的照片动起来。将苹果实况照片弄到抖音上的具体操作方式如下： 苹果实况照片怎么弄到抖音上 1、打开抖音，点击界面中间的+”号， 进入拍摄界...

    阅读: 931

  • 苹果怎么关闭腾讯视频自动续费

    苹果怎么关闭腾讯视频自动续费

    可以通过腾讯视频app或者微信app关闭腾讯视频自动续费。苹果关闭腾讯视频自动续费的具体操作方式如下： 苹果怎么关闭腾讯视频自动续费 一、以腾讯视频为例 1、打开腾讯app，进入vip会员&rdquo...

    阅读: 886

  • 光遇怎么退出当前账号

    光遇怎么退出当前账号

    《光·遇》是由游戏制作人陈星汉及其团队Thatgamecompany开发的社交冒险游戏。以下是推出光遇当前账号的操作方法： 光遇怎么退出当前账号 1、打开光遇app，在初始呈现界面中找到...

    阅读: 880

  • 微信接龙管家小程序怎么用

    微信接龙管家小程序怎么用

    接龙管家小程序，解决了微信/QQ群消息刷屏、无统计、无反馈、无留存的痛点。以下是如何使用微信接龙管家小程序的操作方法： 微信接龙管家小程序怎么用 1、打开微信app，点击搜索按钮，搜索接龙小程序&rd...

    阅读: 863

  • vivo手机查定位找手机

    vivo手机查定位找手机

    vivo手机系统有查定位找手机的功能，可以利用vivo公司的云服务功能来进行查定位找手机，操作步骤如下： vivo手机查定位找手机 1、打开手机的设置，点击首行的个人头像，进入账号中心页面中。 2、...

    阅读: 880

热门文章

最近更新