如何禁用-webkit-app-region：拖动；？答案

【问题标题】：How to disable -webkit-app-region: drag;?如何禁用-webkit-app-region：拖动；？
【发布时间】：2014-04-29 18:40:20
【问题描述】：

我有一个chrome-app，我通过css类将-webkit-app-region: drag;添加到div，使整个窗口可拖动：

示例：

<style>
    draggable {
        -webkit-app-region: drag;
    }
</style>

<div class='draggable'>
    hello world
</div>

问题是我不能通过从div 中删除draggable 类来禁用拖动（例如通过jQuery 或chrome-debugger）。除了这是一个潜在的错误之外，是否有任何解决方法可以阻止 div 使应用程序窗口可拖动？

仅供参考：我已经在 Chrome(34.0.187.116)、Chrome Beta(35.0.1916.69)、Chrome Canary(36.0.1964.2) 上检查了这一点，并且都具有相同的行为。操作系统：MacOS X 10.9.2

【问题讨论】：

标签： google-chrome google-chrome-app

【解决方案1】：

我目前正在使用电子（以前的 atom-shell）构建应用程序。大约在到达您的问题时，我找到了解决此问题的方法，就像其他任何事情一样，答案非常简单。

以这个例子作为我的实例和解决方案：

1) 您的问题是 div 块中的任何内容（包括 div）都是可拖动的，并且您会失去一些功能（例如，点击其中包含的链接），对吧？

<div style='-webkit-app-region:drag'>...</div>

如果您想在该拖动区域内放置锚点：

<div style='-webkit-app-region:drag'>
<a href='index.html'>...</a>
<a href='about.html'>...</a>
</div>

变得可点击，你只需要照你说的做：

我无法禁用拖动

禁用拖动...这是证明它的代码。

<a style="-webkit-app-region: no-drag;" href="index.html">...</a>

这不仅会停止对该元素的拖动功能，它还允许您点击进入被 webkit 阻止的事件。

【讨论】：

【解决方案2】：

我找到了解决方法。通过display: none 隐藏div 可以禁用可拖动对象。

【讨论】：

我知道如何提交 chromium 错误，但我可以在哪里提交 chrome 错误？ - 刚看到。会的。
提交了bug

【解决方案3】：

只需在这些特定元素上使用规则 -webkit-app-region:no-drag 即可

【讨论】：

完美，干得好

【解决方案4】：

-webkit-app-region:no-drag 不起作用，所以我刚刚创建了另一个 div .drag-overlay-div{position:absolute; z-index:1000; -webkit-app-region:no-drag} 现在使用 display:none/display:block 激活/停用此 .drag-overlay-div

【讨论】：