如何禁用-webkit-app-region:drag;?

时间:2014-04-29 18:40:21

标签: google-chrome google-chrome-app

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

示例:

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

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

问题是我无法通过从draggable删除div类来禁用拖动(例如通过jQuery或chrome-调试器)。除了这是一个潜在的错误,有没有办法阻止div使应用程序窗口可拖动?

仅供参考:我在Chrome(34.0.187.116),Chrome测试版(35.0.1916.69),Chrome Canary(36.0.1964.2)上都检查了这一点,并且都具有相同的行为。操作系统:MacOS X 10.9.2

4 个答案:

答案 0 :(得分:3)

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

答案 1 :(得分:3)

我目前在电子(以前称为原子壳)中构建应用程序。在到达你的问题的时候,我找到了解决这个问题的方法,就像其他任何东西一样,答案非常简单。

将此示例作为我的实例和解决方案:

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 :(得分:1)

只需对这些特定元素使用规则-webkit-app-region:no-drag全部

答案 3 :(得分:0)

-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