# Positioning and Dragging

The Kendo UI for Angular Window enables you to [set its position](https://www.telerik.com/kendo-angular-ui/components/dialogs/window/positioning-dragging#positioning) and [move it by dragging](https://www.telerik.com/kendo-angular-ui/components/dialogs/window/positioning-dragging#dragging).

## Positioning

To specify the initial position of the Window, use its [`top`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#top) and [`left`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#left) inputs. If you omit either input, the Window centers along that axis of the viewport.

To control the position from your application state, use two-way binding with the `top` and `left` properties. The [`topChange`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#topchange) and [`leftChange`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#leftchange) events emit the updated offsets while the user drags the Window, so the bound values stay in sync with its position.

The following example sets the initial position of the Window and keeps its offsets bound to the application state.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dialogs/window/positioning/source.txt)

## Dragging

By default, the Window enables you to move it by dragging its title bar. To control this behavior, use the [`draggable`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#draggable) input. Set it to `false` to prevent the user from dragging the Window.

The following behaviors apply to dragging:

* Dragging is not available while the Window is maximized. For more information, see [Minimizing and Maximizing](https://www.telerik.com/kendo-angular-ui/components/dialogs/window/minimizing-maximizing).
* When the Window itself has focus, the arrow keys move it by 10 pixels. Setting `draggable` to `false` disables this keyboard movement as well.
* The [`dragStart`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#dragstart) and [`dragEnd`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#dragend) events fire when the user starts and finishes dragging the Window.

The following example lets you toggle the [`draggable`](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent#draggable) input of the Window.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/dialogs/window/positioning/dragging/source.txt)

## Suggested Links

* [API Reference of the Window](https://www.telerik.com/kendo-angular-ui/components/dialogs/api/windowcomponent)
