美文网首页
设置-webkit-app-region后鼠标点击失败的解决方式

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

作者: SailingBytes | 来源:发表于2022-04-19 14:24 被阅读0次

    要使的窗口可以拖动,需要给相应元素设置 -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>

    相关文章

      网友评论

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

          本文链接:https://www.haomeiwen.com/subject/ahesertx.html