使用 JavaScript 获取 iPhone X 安全区域

2024-02-14

We have safe-area-inset-left, safe-area-inset-right, safe-area-inset-top, and safe-area-inset-bottom在 CSS 中,但是我们如何使用 JavaScript 获取这些值呢?


From https://benfrain.com/how-to-get-the-value-of-phone-notches-environment-variables-env-in-javascript-from-css/ https://benfrain.com/how-to-get-the-value-of-phone-notches-environment-variables-env-in-javascript-from-css/。您可以在链接中找到更多上下文。

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);
}

JS内

getComputedStyle(document.documentElement).getPropertyValue("--sat")
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JavaScript 获取 iPhone X 安全区域 的相关文章

  • iPhone 的电子书框架

    我有一本书想作为 iPhone 应用程序发布 有谁知道我可以使用免费 或便宜 的框架来实现这一目标 换句话说 我想为我的书创建一个独立的 XCODE 项目 其中包含 iPhone 用户将本书作为独立应用程序阅读所需的所有代码 我见过 O R
  • Parse.com 从相关 PFObject 获取 PFUser

    我正在将照片保存为 PFObject 解析 并使用 PFUser currentUser 用户 ID 作为其键之一 我想在表格视图中显示照片以及该 PFUser 的详细信息 但是当我尝试获取用户时 PFUser user self phot
  • 如何知道我的应用程序使用了多少 iCloud 空间?

    有没有办法查看我的应用程序正在备份到 iCloud 的内容以及它消耗了多少内存 Settings gt iCloud gt Storage Backup gt Manage Storage将显示正在备份的总计内容 iOS 会备份位于应用程序
  • 如何使用 Playwright 使用选择器查找框架 (iframe)

    我有一个小问题 无法找到使用 Microsoft Playwright 框架的答案 根据您可以使用以下代码获取 iframe const frame page frame frame login 但是如何使用选择器来查找 iframe 并与
  • IntersectionObserver是否支持水平滚动观察?

    我制作了几个垂直滚动 IntersectionObserver 模块 但我对水平滚动感兴趣 根将是 div 观察目标将是 img 我想观察当 img 放大但 div 保持视口宽度时的变化 我什至不确定移动 Safari 是否会将缩放后的图片
  • 将 SSLSetEnabledCiphers 与 AFNetworking 结合使用来禁用弱密码

    我正在尝试禁用一些密码 弱 例如单个 DES 单个 DES 40 位等 我尝试过使用这段代码在 Cocoa 中使用 CFSocket CFStream 时如何设置 SSL 密码 https stackoverflow com questio
  • 忽略触摸事件,让其下面的视图处理触摸?

    我有一个用户可以触摸的可拖动视图 但它的某些矩形将没有图像 alpha 0 当用户单击透明区域时 我能够在没有 alpha 信息的情况下构造透明区域 我希望透明区域下方的视图 同一类 来检测触摸 我的策略是当用户触摸透明区域时让视图忽略触摸
  • 如何在另一个自定义 Hook 中使用返回值的自定义 Hook?

    我正在使用 React native 其中有一个名为的自定义 HookuseUser使用以下方法从 AWS Amplify 获取用户信息Auth getUserInfro方法 然后获取返回对象的一部分并用它设置一个状态变量 我还有另一个名为
  • mongodb 聚合 - 累积字段的不同组值

    如果我有Player表格文件 name String score Int 我有Group文档 其中组代表玩家列表 groupName String players ObjectID 玩家可以属于多个组 我想做一个聚合Player文档 按以下
  • 虚拟乐器 iPhone 应用程序中的 VoiceOver 辅助功能?

    我收到盲人用户的评论 称我的一些声音和音乐相关应用程序只能在关闭 VoiceOver 的情况下使用 在 iOS 设备上启用 VoiceOver 辅助功能后 是否可以启用音乐键盘或鼓垫触摸区域 以便在点击键盘键或虚拟鼓组 等 时可以立即播放音
  • 聆听 Angular 2 中的元素可见性

    我正在为我的网络应用程序使用 Bootstrap 和 Angular 2 v4 我想监听指令中的元素以了解可见性变化 我的元素有一个可以隐藏其子元素的父元素hidden sm up我需要在每次隐藏或显示时触发一个函数 div hidden
  • 如何使用 JavaScript 或 jQuery 克隆 HTML 元素的样式对象?

    我正在尝试克隆元素的样式对象 这应该允许我在更改后重置所述元素的样式 例如 el style left 50px curr style left 50px Modify the elements style The cloned style
  • Rails 3.1+ 的 Jasmine 与 Mocha JavaScript 测试 [已关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我对茉莉花有经验并且非常喜欢它 有谁有 Jasmine 和 Mocha 的经验 特别是 Rails 的经验吗 我想知道是否值得转用 我已经在 J
  • Highcharts jQuery 渲染问题 - 所有浏览器

    我在尝试使用构建堆积柱形图时遇到了一个奇怪的问题高图表 http www highcharts com 当图表呈现时 在您调整浏览器大小之前 不会显示列无论如何 导致图表重绘 我认为 图表的其余部分显示 轴 标题等 但不显示列本身 我在 I
  • 使用 Enzyme 测试 `React.createRef` api

    我想测试下面的类 它使用React createRef api 不过 快速搜索并没有发现任何这样做的例子 有人成功过吗 我该如何嘲笑裁判 理想情况下我想使用shallow class Main extends React Component
  • 加载新控制器时,iPhone 横向模式切换到纵向模式

    我的应用程序在横向模式下正确启动并且运行良好 BOOL shouldAutorotateToInterfaceOrientation UIInterfaceOrientation interfaceOrientation if interf
  • 有没有办法使用 ko.observableArray 作为地图?

    有没有办法使用ko observableArray http knockoutjs com documentation observableArrays html像地图 字典一样 例如 var arr ko observableArray
  • react-native - 图像需要来自 JSON 的本地路径

    你好社区 我正在react native中开发一个测试应用程序 并尝试从本地存储位置获取图像 我实际在做什么 我将图像直接链接源提供给 var 并在渲染函数中调用此方法 react 0 14 8 react native 0 23 1 np
  • UIView晃动动画

    我试图在按下按钮时使 UIView 摇动 我正在调整我找到的代码http www cimgf com 2008 02 27 core animation tutorial window shake effect http www cimgf
  • 仅当显式选择行时才关闭 ui-bootstrap typeahead

    我创建了这个jsBin http jsbin com livuqafe 2 edit来证明我遇到的问题 如果您转到此处 请尝试输入 五 并继续 你的自然反应是输入 五 然后按 Tab 如果你想要 五百 你可以向下箭头一次 但是 在这种情况下

随机推荐

  • (numpy) __array_wrap__ 有什么作用?

    我第一次深入 SciPy LinAlg 模块 我看到了这个函数 def makearray a new asarray a wrap getattr a array prepare new array wrap return new wra
  • 'quietly = TRUE' 何时在 require() 函数中真正起作用?

    我正在尝试编写一组函数来检查丢失的 R 软件包 并在必要时安装它们 StackOverflow 上有一些很好的代码可以做到这一点 从这里开始 https stackoverflow com questions 4090169 elegant
  • 在更改视图的可见性时应用动画

    我的应用程序中有一个 Horizo ntalScrollView 并且我经常使用它的可见性 可见和消失 所以我想要的是 我可以应用某种动画或其他东西 使其开始以滑动的方式变得可见和不可见 而不是突然使其可见和不可见吗 任何帮助或建议将不胜感
  • 本地主机上的 Django/Celery 多个队列 - 路由不起作用

    我跟着芹菜docs http celery readthedocs org en latest userguide routing html manual routing在我的开发机器上定义 2 个队列 我的芹菜设置 CELERY ALWA
  • 从 Eclipse 中删除插件的正确方法

    上次 我遇到了从 Eclipse 中删除插件的问题 症状 1 如果删除通过已安装菜单 无法正确重新安装并且有多个视角 例如对于 SQL 资源管理器 在Open Perspective menu 2 如果通过文件系统删除 手动从plugins
  • 人员 API 谷歌配额限制

    我正在研究 People API 这仅适用于 google 用户 有人知道吗 我一天 分钟可以免费询问多少次 一般配额限制是多少 超过门槛需要花费多少钱 Thanks 有两种不同的 People API 您可以在云控制台中查看两者的配额 G
  • 具有基本身份验证的 Webclient / HttpWebRequest 返回 404 未找到有效 URL

    编辑 我想回来指出问题根本不在我这边 而是与另一家公司的代码有关 我正在尝试使用基本身份验证来打开页面 我不断收到 404 页面未找到错误 我可以将我的网址复制并粘贴到浏览器中 它工作正常 如果我尚未登录他们的网站 它会弹出一个凭据框 否则
  • ASP.NET Core 默认调试启动 URL

    使用 ASP NET Core Web API 模板时 默认调试启动 URL 以某种方式设置为api values 此默认配置在哪里以及如何更改它 我能找到的有关此启动 URL 声明位置的文档非常少 这个里面有简短的提及博客文章 https
  • vuelidate 异步验证器 - 如何去抖?

    因此 我的电子邮件 用户表单元素上的异步验证器存在问题 每次输入字母时 它都会检查有效性 如果电子邮件有 30 个字符 那么就超过 30 个电话 有人知道消除 vuelidate 自定义验证器的最佳方法吗 当我尝试使用 debounce 时
  • 传统 For 循环与增强型 For 循环 [重复]

    这个问题在这里已经有答案了 这段代码 import java util import java io class TestClass public static void main String args throws Exception
  • Visual Basic .NET 中的 UInt32 数据类型是什么?

    是什么UInt32VB NET 中的数据类型 有人可以告诉我它的位长度和之间的区别吗UInt32 and Int32 它是整数还是浮点数 它是一个无符号 32 位整数 U 表示无符号 Int 表示整数 32 换 32 或者你可以看看文档 h
  • 将 SageMaker 管道模式与 tfrecords 的 s3 目录结合使用

    我打电话给sagemaker tensorflow TensorFlow fit 当我使用时无限期挂起 没有错误消息Pipe代替File as the input mode 我相应地替换了TensorFlowDataset with Pip
  • Log4j2 系统属性写入文件

    我使用以下 log4j2 配置
  • 平板电脑或手机 - Android

    有没有办法检查用户是否使用平板电脑或手机 我的倾斜功能和新平板电脑 Transformer 出现问题 正如之前提到的 您不想检查设备是平板电脑还是手机 而是想了解设备的功能 大多数时候 平板电脑和手机之间的区别在于屏幕尺寸 这就是您想要使用
  • 将 URL 拖放到浏览器中并使用 jQuery 进行处理

    我需要能够将 URL 从浏览器中的 URL 栏 拖放到网页中 使用该链接向 Web 服务发出请求 然后获取 JSON 回复并填充表单 我已经能够创建处理链接的 Web 服务 并且我已经能够使用 jQuery ajax 发出请求 但我不确定如
  • MVVM 命令绑定

    我正在尝试学习 MVVM 模式 我遇到的主要问题是学习应该在哪里声明 创建和绑定命令对象 2个例子 我有一个主窗体 其作用类似于交换机或主菜单 选择按钮 1 并显示视图 1 选择按钮 2 并显示视图 2 伟大的 现在我想返回主窗体 因此我需
  • 错误:React Native expo-video-thumbnails IOS 中无法写入文件错误

    我正在从视频 URL 生成缩略图 它在 Android 中工作正常 但在 IOS 中出现错误 Error Can t write to file 下面是我的代码 import as VideoThumbnails from expo vid
  • Node JS 智利现行 DST 规则

    根据规范 Node JS ES5 在处理 Date 对象时应使用当前的 dts 规则 当前的意思是 现在 而不是特定的日期 这并不完美 但目前对我来说已经足够了 目前 该规则是错误的 由于智利法律的变化 简单探针 console log n
  • 如何使用 scala 将 postgreSQL 数据库连接到 Apache Spark?

    我想知道如何在 scala 中执行以下操作 使用 Spark scala 连接到 postgreSQL 数据库 编写 SQL 查询 如 SELECT UPDATE 等 来修改表 那个数据库 我知道使用 scala 来做到这一点 但是如何在打
  • 使用 JavaScript 获取 iPhone X 安全区域

    We have safe area inset left safe area inset right safe area inset top and safe area inset bottom在 CSS 中 但是我们如何使用 JavaSc