设置-webkit-app-region后鼠标点击失败的解决方式

要使的窗口可以拖动,需要给相应元素设置 -webkit-app-region: drag 属性。

.title-container {

    -webkit-app-region: drag;

}

但同时也会暴露出3个问题:

会使的当前元素的权级高于其他元素,通过设置z-index等也不能解决;

该元素及所有子元素将触发不了鼠标的相关事件;

元素所在区域,双击全屏和 restore size 等功能又废。


如何解决(既要可以拖动窗口,又不会影响窗口内部的元素)?

在设置该属性的元素中,增加一个等宽、等高的元素,该元素设置 -webkit-app-region: no-drag 属性。

.title-content {

    -webkit-app-region: no-drag;

}

<div class="title-container">

    <div class="title-content ">......</div>

</div>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容