关于前端:通过JavaScript获取刘海屏安全区域高度的方式

在css中,能够通过env()函数读取平安区域标准定义的边界间隔值,比方:

margin-top: env(safe-area-inset-top);

但这个办法只能用于css中,JavaScript是无奈间接读取env函数的。

想在JavaScript中读取env函数值,须要应用css自定义属性(变量)

首先设置:

:root {
    --sat: env(safe-area-inset-top);
    --sar: env(safe-area-inset-right);
    --sab: env(safe-area-inset-bottom);
    --sal: env(safe-area-inset-left);
}

而后能够在JavaScript中,通过以下办法,读取到css自定义变量

getComputedStyle(document.documentElement).getPropertyValue("--sat")

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理