Как сделать безрамочное окно приложения Chrome подвижным?

Я создал приложение Chrome с окном, но оно не перемещается. Я хочу сделать верхнюю панель (в стиле HTML/CSS), которая позволяет ей двигаться. Я просмотрел примеры приложений Chrome, но не могу найти код, позволяющий перетаскивать окно.


person Don Rhummy    schedule 15.10.2013    source источник


Ответы (1)


Я нашел ответ, и он не появился в документации, и при этом он не был очевиден. Это свойство CSS, которое управляет этим.

-webkit-app-region: drag;

Без этого ваше безрамное окно невозможно сдвинуть.

ВАЖНО: Любой дочерний узел перетаскиваемого узла, который вы хотите сделать кликабельным или интерактивным, должен иметь -webkit-app-region: no-drag; в своем CSS.

Например:

.myCustomBar {
    position: absolute;
    width: 100%;
    height: 30px;
    -webkit-app-region: drag;
}

.myCustomBarCloseButton {
    position: relative;
    width: 100px;
    height: 30px;
    -webkit-app-region: no-drag;
}
person Don Rhummy    schedule 15.10.2013
comment
Это задокументировано в параметре создания фрейма. developer.chrome.com/apps/app_window.html#method-create - person Vincent Scheib; 16.10.2013
comment
Даже позже, через несколько месяцев, это очень помогло простым объяснением, спасибо, Дон. - person EasyBB; 26.11.2013
comment
@VincentScheib Это, кажется, сбивает с толку многих людей, может быть, документацию можно обновить, чтобы показать пример кода CSS, показывающий этот обязательный параметр? - person Don Rhummy; 17.09.2014