JavaScript 屏幕旋转后获取浏览器宽高
JavaScript 大约 872 字问题
旋转事件中获得的浏览器宽高window.innerHeight
、window.innerWidth
或者document.body.clientHeight
、document.body.clientWidth
是选择之前的宽高。
解决
可以使用延迟获取的方法。
示例
var body = document.documentElement || document.body;
if ("onorientationchange" in window) {
window.onorientationchange = onScreenRotate;
} else if ("screen" in window && "orientation" in window.screen) {
window.screen.orientation.addEventListener("change", onScreenRotate);
}
function onScreenRotate(event) {
setTimeout(function () {
document.getElementById("init").innerText = "body.clientWidth#" + body.clientWidth + ", body.clientHeight#" + body.clientHeight;
document.getElementById("status").innerText = screen.orientation.type;
}, 200)
}
备注
如果只在移动设备上使用该API
,且不考虑Android
的分屏、小窗,Surface
设备上的拖动边框,可以使用window.screen.width
、window.screen.height
或window.screen.availWidth
、window.screen.availHeight
。
阅读 1088 · 发布于 2021-06-27
————        END        ————
Give me a Star, Thanks:)
https://github.com/fendoudebb扫描下方二维码关注公众号和小程序↓↓↓

昵称:
随便看看
换一批
-
Android item 填充时最外层布局高度失效解决办法阅读 1669
-
PHP查看配置文件所在位置阅读 1194
-
Java 中的死锁阅读 963
-
Linux 之定时任务 crontab阅读 2050
-
Linux 编译安装 Nginx阅读 3598
-
Vue-cli+webpack 配置接口代理解决跨域问题阅读 2194
-
Nginx 配置之 worker_processes阅读 4007
-
Kubernetes Pod 控制器 Job阅读 559
-
Android MediaMetadataRetriever 获取多媒体文件信息阅读 3703
-
Docker No route to host阅读 1796