gpt4 book ai didi

javascript - 如何在移动设备上独立于 URL 栏的当前隐藏/显示状态获取视口(viewport)高度?

转载 作者:行者123 更新时间:2023-11-29 23:21:14 24 4
gpt4 key购买 nike

在移动设备上(例如 Android 上的 Chrome),视口(viewport)高度会根据 URL/地址栏是否隐藏而变化,这会根据您是在页面上向上滚动还是向下滚动而变化。

鉴于此,我需要 2 个变量:

  1. 显示 URL 栏时的视口(viewport)高度(无论实际状态如何)。
  2. URL 栏显示时的视口(viewport)高度(无论实际状态如何)。

换句话说:“最小”和“最大”视口(viewport)高度。我该怎么做呢?我只知道如何获取:

  • 给定 URL 栏当前状态(显示/不显示)的视口(viewport)高度。

通过执行:Math.max(document.documentElement.clientHeight, window.innerHeight || 0)(来源:https://stackoverflow.com/a/8876069/473368)。

最佳答案

为此,使用 window.outerHeight 属性:

Window.outerHeight gets the height in pixels of the whole browser window. It represents the height of the whole browser window including sidebar (if expanded), window chrome and window resizing borders/handles.

要扩展你的功能,只需比较window.outerHeightwindow.innerHeight:

let maxHeight = Math.max(window.innerHeight || 0, window.outerHeight || 0);
let minHeight = Math.min(window.innerHeight || 0, window.outerHeight || 0);
console.log(maxHeight, minHeight);

关于javascript - 如何在移动设备上独立于 URL 栏的当前隐藏/显示状态获取视口(viewport)高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50553646/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com