iOS Safari 浏览器 100vh 带有滚动条解决方案

简介: iOS Safari 浏览器 100vh 带有滚动条解决方案

问题场景

在移动端 safari 或者 chrome 浏览器中,使用 100vh,会出现滚动条。

根本原因

safarichrome 浏览器中,100vh 是指去掉地址栏的高度,所以会出现滚动条。

解决方案

移动端一般不考虑 chrome 浏览器,用户基数小,如果只考虑微信公众号开发也不用考虑这个问题。如果需要考虑 safari 浏览器的用户体验,建议使用 100% 替代 100vh,或者使用 js,而不是 100vh

相关文章
|
2月前
|
Web App开发 移动开发 Android开发
解决IOS Safari浏览器H5页面上下滑动时卡顿、页面缺失的问题
解决IOS Safari浏览器H5页面上下滑动时卡顿、页面缺失的问题
|
2月前
|
移动开发 安全 前端开发
uniapp打包iOS应用并通过审核:代码混淆的终极解决方案 ✨
本篇博客将教你如何使用 JavaScript-obfuscator 插件来一键发行和混淆 iOS 上的 uniapp 代码。通过安装插件、创建运行脚本,并执行混淆操作,你将能够轻松通过审核,提高应用程序的安全性。🔒
|
5月前
|
Web App开发 安全 JavaScript
关于 Safari back 按钮在 iOS 16 不能按照期望工作的问题分析
关于 Safari back 按钮在 iOS 16 不能按照期望工作的问题分析
46 0
|
5月前
|
iOS开发
解决IOS端微信浏览器input,textarea有内上边框阴影
解决IOS端微信浏览器input,textarea有内上边框阴影
36 0
|
6月前
|
Web App开发 JavaScript Android开发
JS 解决移动端浏览器(Safari、Alook...)无法禁止缩放问题
JS 解决移动端浏览器(Safari、Alook...)无法禁止缩放问题
195 0
|
6月前
|
Swift iOS开发
iOS PhotoBrowser 横竖屏图片浏览器
iOS PhotoBrowser 横竖屏图片浏览器
88 0
|
7月前
|
JavaScript 前端开发 iOS开发
javascript格式化时间:ios不支持时间戳转换解决方案
javascript格式化时间:ios不支持时间戳转换解决方案
130 0
|
9月前
|
移动开发 iOS开发
h5的header在iOS app内不显示,在浏览器显示正常解决办法
h5的header在iOS app内不显示,在浏览器显示正常解决办法
74 0
|
10月前
|
Web App开发 前端开发 JavaScript
前端基本开发工具的浏览器之Safari
Safari是一款苹果公司开发的浏览器,它在Mac OS和iOS操作系统上广受欢迎。下面就让我们来看看Safari的特点和优势。
202 0
|
10月前
|
Web App开发 iOS开发
element-plus:Message 消息提示组件safari浏览器中显示异常
element-plus:Message 消息提示组件safari浏览器中显示异常
129 0
element-plus:Message 消息提示组件safari浏览器中显示异常