WindowControlsOverlay：geometrychange 事件
当渐进式 Web 应用的标题栏区域的位置、大小或可见性发生变化时，会触发 geometrychange 事件。
这仅适用于安装在桌面操作系统上的渐进式 Web 应用，并且使用了 窗口控件覆盖 API。
语法
在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。
js
addEventListener("geometrychange", (event) => { })
ongeometrychange = (event) => { }
事件类型
事件属性
除了下面列出的属性之外，父接口 Event 的属性也可使用。
titlebarAreaRect-
一个
DOMRect，表示应用内容中标题栏区域的位置和大小。 visible-
一个 布尔值，指示窗口控件覆盖层是否可见。
示例
使用 addEventListener()
js
navigator.windowControlsOverlay.addEventListener("geometrychange", (event) => {
const { x, y, width, height } = event.titlebarAreaRect;
console.log(
`The titlebar area coordinates are x:${x}, y:${y}, width:${width}, height:${height}`,
);
});
使用 ongeometrychange 事件处理程序属性
js
navigator.windowControlsOverlay.ongeometrychange = (event) => {
const { x, y, width, height } = event.titlebarAreaRect;
console.log(
`The titlebar area coordinates are x:${x}, y:${y}, width:${width}, height:${height}`,
);
};
规范
| 规范 |
|---|
| 窗口控件覆盖 # the-ongeometrychange-attribute |
浏览器兼容性
加载中…