chrome/common/extensions/docs/templates/intros/app_window.html

   1 <h2 id="draggable">A note on draggable window areas</h2><p>
   2
   3 <p>
   4 Windows can be moved by dragging on the default title bar,
   5 but frameless windows do not have that affordance.
   6 The CSS property <code>-webkit-app-region</code> can be given the values
   7 <code>drag</code> and <code>no-drag</code> to allow content of a window
   8 to create draggable areas. Care must be taken when setting a high level
   9 DOM node to drag, any child that is intractable/clickable must be set to
  10 no-drag. E.g.
  11 <p>
  12
  13 <pre data-filename="window.html">
  14 &lt;div class='title-area'>
  15   A draggable area. &lt;div class='title-button'>clickable button&lt;/div>
  16 &lt;/div>
  17 </pre>
  18
  19 <pre data-filename="style.css">
  20 .title-area {
  21   -webkit-app-region: drag;
  22 }
  23 .title-button {
  24   -webkit-app-region: no-drag;
  25 }
  26 </pre>
  27
  28 <p>
  29 See the <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/frameless-window">Frameless Window Sample</a> as an example.
  30 </p>
  31