H5兼容性问题

已于 2023-05-18 17:10:30 修改
阅读量336 收藏
点赞数
文章标签： ffmpeg
于 2023-05-18 17:09:13 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43955678/article/details/130751209
版权
在微信内置浏览器中，H5视频的autoplay属性可能不工作，需要通过$refs.video.pause手动控制。同时，该环境也限制了默认音乐播放。对于iOS设备，部分视频播放需要转换为AVC(H264)编码，且有时视频封面显示为黑色，需手动添加封面并处理每一帧。
摘要由CSDN通过智能技术生成

1、在微信内置浏览器打开H5视频autoplay不生效，需要用到$refs.video.pause

2、微信内置浏览器禁止默认播放音乐

2、ios浏览器有的视频播放不了，需要转码为 AVC(H264) 格式。

3、ios浏览器有的视频封面无效是黑色的，需要手动加封面，多个视频需要循环每个视频的每一帧

six days
关注
h5兼容性总结
dachaoxuexi的博客
10-18 1216
在解决问题方面，尤其是在解决兼容性方面，兼容ios10以及Android5，做了些总结: CSS添加前缀，可以利用postcss-loader,新建postcss.config.js，添加 ‘autoprefixer’: {},配置;然后新建.browserslistrc文件，配置兼容浏览器，ios以及Android的版本范围。 引入postcss-loader: use: ['postcss-loader'], 新建postcss.config.js: module.exports = { p
html兼容性面试题
m0_72704380的博客
08-20 555
兼容性面试题
H5的兼容问题总结
weixin_30918415的博客
09-21 167
聚焦问题 Android会出现点击聚焦的情况，出现黄色的边框，通过对相应的元素设置css –webkit-tap-highlight-color: rgba(0,0,0,0)解决，另外一些高版本的系统也可能会出现有黄色边框的情况，这时候试着用outline：none来解决。 Android position:fixed及input中文输入bug 在android系统中，如果页面中有p...
如何处理HTML5新标签的浏览器兼容问题
最新发布
My_wife_QBL的博客
07-12 819
处理HTML5新标签的浏览器兼容问题需要综合运用多种技术和工具，包括HTML5 Shiv、CSS Reset、Normalize.css、Modernizr、Polyfill、优雅降级和渐进增强等。通过这些方法，开发者可以确保Web应用在不同浏览器中都能正常运行，提供一致的用户体验。在实际开发过程中，定期进行兼容性测试和优化，保持对新技术和工具的关注，将有助于持续提升Web应用的质量和兼容性。
H5兼容性问题汇总
_web_Z的博客
11-04 1418
android在软键盘弹起或收起时，会改变window的高度，因此监听window的onresize事件；（1）、在ios中软键盘弹起时，仅会引起body的scrollTop值改变，可以通过输入框的获取焦点情况来做判断。⚠️ ios系统弹起软键盘时，固定定位失效，这是所有ios系统的一个bug，出现此问题时就利用上面监听输入框获取焦点和失去焦点的方法改变样式。html 或者body添加 {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);//兼容firebox。
H5页面前端开发常见的兼容性问题解决方法
web15085599741的博客
03-12 7415
1. IOS系统下输入框光标高度不正常 问题描述：input输入框光标，在安卓手机上显示没有问题，但是在苹果手机上当点击输入的时候，光标的高度和父盒子的高度一样，看起来很怪异。例如下图，左图是正常所期待的输入框光标，右边是IOS的 input 光标。 解决办法：高度height和行高line-height内容用padding撑开。 .content{ float: left; box-sizing: border-box; height: 88px; width: calc
h5前端兼容性问题及解决方法集合
醉逍遥neo的博客
05-20 3255
整理归纳一些之前记录的h5兼容性问题以及相应的解决方法，大多都是移动端的，持续更新… 1、iOS滑动卡慢 ios里父元素设置overflow:auto或scroll时，子元素滚动时没有滚动惯性，手指离开屏幕就立即停止滚动，所以会有一种卡和慢的感觉。 目前发现ios13及以上系统没有这个问题，但低版本的还会出现，需要解决。 解决方法： css里给滚动父元素设置： -webkit-overflow-scrolling: touch; 注意：这个css属性有很多坑，谨慎使用，例如会导致绝对定位元素会被父元
遇到的那些手机兼容问题
01-03
记录下使用不同厂商的手机时遇到的各种奇怪问题。 VIVO手机 我用的是VIVO X21A，Android 8.1.0系统，遇到的奇怪问题如下： 开发者模式打开之后，无法连接adb命令，导致无法连接Android Studio。反复开关debug开关...
H5兼容性测试点.docx
01-08
五、GPU兼容性问题： * Adreno、PowerVR、Mali 系列市场占有率比较高，兼容性基本都没啥大问题 * Nvidia 的 Tegra 系列显卡大厂 Nvidia 研发的 Tegra CPU 自带的 GPU H5兼容性测试是非常重要的，它能够确保H5应用...
解决IOS端微信H5页面软键盘弹起后页面下方留白的问题
12-11
前言：微信H5项目，ios端出现了软键盘输完隐藏后页面不会回弹，下方会有一大块留白 最近微信和ios都有版本升级，不知道是哪边升级造成的，但是经过测试，软键盘收起后，再滚动一下页面，下面的留白就会消失。所以...
移动端h5项目的兼容和适配问题
MissXu666的博客
08-29 4818
推测可能是Android在排版计算的时候参考了primyfont字体的相关属性（即HHead Ascent、HHead Descent等），而primyfont的查找是看font-family里哪个字体在fonts.xml里第一个匹配上，而原生Android下中文字体是没有family name的，导致匹配上的始终不是中文字体，所以解决这个问题就要在font-family里显式申明中文，或者通过什么方法保证所有字符都fallback到中文字体。单位面积内的像素越多，图像的效果就越好。
H5常见的兼容问题及解决
dearbaba_11的博客
05-21 249
H5常见的兼容问题及解决
html5兼容性处理最佳解决方案
流年灬似氺的博客
03-21 790
做项目时使用到了h5,但因为浏览器兼容性问题使布局变得杂乱无序,为此搜索了大量资料，发现解决方法不一，在仔细研究后发现此种方法很是简单实用，故写出来与大家共享。
微信H5页面兼容性解决方案
Tangsze的博客
11-18 374
https://mp.weixin.qq.com/s/L7I0p656V2O310ac_OqxyA
H5在微信中的兼容性问题
weixin_30471065的博客
11-18 258
1.设置 overflow scroll 在IOS中滑动不流畅的问题 -webkit-overflow-scrolling: touch 2.用bootstrap 模态框弹在IOS中弹不出的问题 cursor: pointer; 转载于:https://www.cnblogs.com/zhuwu/p/7856325.html...
HTML5浏览器的兼容
qq_41515821的博客
12-16 214
HTML5浏览器的兼容 html代码： <!--[if lt IE 9]> <script src="html5shiv.js"></script> <![endif]--> js代码： var e=("abbr,article,aside,audio,canvas,datalist,details,"+ "figure,footer,head...
移动端响应式设置(适合微信H5)
awc49246的博客
01-03 280
准备： 该代码默认为jq环境下运行，如不支持，请自行兼容 该方法更适合微信端宣传类型H5，设计稿要求为640x1236（兼容Iphone X） 设置viewport页面宽度为640 1 <meta name="viewport" content="width=640,user-scalable=no,maximum-scale=1.0,target-densitydpi...
微信H5页面前端开发，几个兼容问题
TOMORROW-前端
08-04 520
1、ios端兼容input光标高度 问题详情描述：input输入框光标，在安卓手机上显示没有问题，但是在苹果手机上 当点击输入的时候，光标的高度和父盒子的高度一样。例如下图，左图是正常所期待的输入框光标，右边是ios的input光标。 图片描述 出现原因分析：通常我们习惯用height属性设置行间的高度和line-height属性设置行间的距离（行高），当点击输入的时候，光标的高度就自动和父盒子的高度一样了。（谷歌浏览器的设计原则，还有一种可能就是当没有内容的时候光标的高度等于input的line-heig
h5的兼容性问题怎么解决
06-08
H5的兼容性问题主要是由于...总之，在开发H5页面时，需要对不同浏览器的兼容性进行考虑，采用上述的方案可以有效地解决H5兼容性问题。同时，也可以通过测试工具或者在多个浏览器中进行测试，来发现并修复兼容性问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值