移动兼容问题移动兼容问题

视屏播放---视频在微信上播放完，会有广告(Android)；视屏在微信上播放完没有广告（IOS）
解决方式：使用div内部嵌套播放
代码：

遗存问题：因为添加了控制条，点击全屏按钮观看时，还是会有广告（Android）
视屏滑动 --- 视屏在微信上不能识别上下、左右滑动(Android)，视屏在IOS上，swiper做的左右滑动，不能拉动进度条，只能左右滑动(IOS)
页面下部分“前进后退导航条” ----微信自动识别是否存在跳转历史，存在跳转历史会在下部添加导航条（IOS）；Android不会
【移动兼容问题】页面元素移位 ----登录界面，软键盘导致内元素移位（IOS）
解决方式：针对所有输入框，添加失焦事件（滚动到顶部）
代码：
@blur="blurInput"
blurInput(){
(this as any).$nextTick(() => {
(window as any).scrollTo(0, document.documentElement.scrollTop || document.body.scrollTop);
});
}
onscroll函数兼容 ---Android、IOS一致，华为ipad不一致
解决：识别是否存在获取 top的对象
代码：
(window as any).onscroll = () => {
const top = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
};
参考资料：关于onscroll函数兼容各浏览器的方法分析
css 中:hover在移动端不消失 ---直接返回不消失，按钮处于hover状态（IOS）
解决代码： (document as any).body.addEventListener('touchstart', () => {});

移动兼容问题

推荐阅读

永嘉风光永嘉哪里好玩

劳动是意思相近的词吗快乐是意思相近的词语吗

没开封茶叶会不会过期

迷你世界手机版怎么去竹桃林桃林地形码迷你世界分享

画图工具怎么手绘一款简笔画蛋糕？画图工具手绘简笔画蛋糕的方法

win10epic遭遇了网络连接问题解决方法

荷包蛋面条怎么做荷包蛋面条怎么做视频

4s店样品车可以买吗现在 4s店样品车可以买吗

汽车新四化是什么谈谈汽车新四化

聪明的梅花鹿告诉了我们什么道理一只梅花鹿告诉我们什么道理

周公解梦梦见骨灰盒是什么意思梦见骨灰盒好不好

皮肤瘙痒冷敷多久最好

毛衣可以和其他衣服一起用洗衣机洗吗

十一岁的男孩怎么教育

win101909声卡没声音解决方法

3dmax怎么做雪景关于3DMAX制作雪景的详细操作

品牌规划的流程

手机里库乐队删了怎么办手机库乐队没了怎么办

准备从事棋牌游戏人员必读

审议不通过怎么写会议纪要如何写会议纪要