安卓手机调用键盘把fixed定位挤上去
2022-12-20 本文已影响0人
Xbbing
解决方案
大概思路就是安卓手机调用键盘时 会往上挤 导致clientHeight变化,定位会针对当前区域变化 导致fixed往上偏移
解决: 检测屏幕变化 将此fixed隐藏 当回归原来高的大小的时候 在显示
<!-- 此为fixed定位 -->
<div v-if="hidshow" class="fixed">这是fixed定位</div>
data() {
return {
hidshow: true
}
}
mounted() {
// 获取浏览器可视区域高度
var u = navigator.userAgent;
var isIos = !!u.match(/\(i[^;]+;(U;)?CPU.+Mac OS X/);
if (!isIos) {
// 键盘弹起事件
var _this = this;
var docmHeight = document.documentElement.clientHeight || document.body.clientHeight;
window.onresize = function () {
var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
if (resizeHeight < docmHeight) {
_this.hidshow = false;
} else {
_this.hidshow = true;
}
};
}
}