...器底部工具栏会遮挡内容怎么调?样式是这样的,html,body{height:100%...
发布网友
发布时间:2024-07-21 20:37
我来回答
共2个回答
热心网友
时间:2024-08-04 04:25
function getBrowserInterfaceSize() {
var pageWidth = window.innerWidth;
var pageHeight = window.innerHeight;
if (typeof pageWidth != "number") { //在标准模式下面
if (document.compatMode == "CSS1Compat" ) {
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
} else {
pageWidth = document.body.clientWidth;
pageHeight = window.body.clientHeight;
}
}
document.body.style.height = pageHeight + 'px'
}
通过这个方法就可以获取在手机浏览器去掉头部和底部的实际可用高度,并绑定在body上,其他的可以相对于body来设置高度,这样就不会超出可是高度,不会被底部遮挡。
demo github.com/a2337230/wapHeight.git
热心网友
时间:2024-08-04 04:24
再头部加上:
<meta name="apple-touch-fullscreen" content="yes">"添加到主屏幕“后,全屏显示 <meta name="apple-mobile-web-app-capable" content="yes" />
这meta的作用就是删除默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时,这个行meta就不用加了,默认就是显示。