-webkit-app-region是一个 Electron 中的 CSS 属性,可以用于指明用户是否可以通过拖拽当前的 HTML 元素来完成对整个窗体的拖拽。这种情况主要是针对 frameless 窗口的。-webkit-app-region相当于提供了一个编程可指明的自定义拖拽区域,用于实现类似窗口顶部 toolbar 的效果。
使用方法,只需针对特定的HTML元素,应用如下的CSS就行了:
.draggable {
-webkit-app-region: drag;
}
注意:
如果一个区域因为某个 HTML 元素的存在变成了
-webkit-app-region: drag,那么对于 Windows 系统来说(Mac 经测试不会有这个问题),这个区域上的其他元素(不论是否在 drag 元素的“上方”)都无法收到鼠标的事件(如 click / hover 等)。如果希望可以继续保留某些元素(比如按钮)的鼠标事件,需要在这些元素上通过如下的方式显示声明。
.button {
-webkit-app-region: no-drag;
}