# Positioning and Dragging

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

## Positioning

To specify the initial position of the Window, use its [`initialTop`](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/api/windowprops#initialtop) and [`initialLeft`](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/api/windowprops#initialleft) properties. In this uncontrolled mode, the Window manages its position internally after the initial render. If `initialTop` and `initialLeft` are not provided, the Window is initially positioned at the center of the viewport.

To control the position from your application state, set the [`top`](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/api/windowprops#top) and [`left`](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/api/windowprops#left) properties. Handle the [`move`](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/api/windowprops#onmove) event to receive the updated coordinates while the user drags the Window, and store them in reactive state so that the Window follows the pointer. For more information, see [Controlled Mode](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/window/controlled-mode) and [Events](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/window/events).

The following example sets the initial position of the Window.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/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-vue-ui-develop/components/dialogs/api/windowprops#draggable) property. 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 in the `FULLSCREEN` stage. For more information, see [Minimizing and Maximizing](https://www.telerik.com/kendo-vue-ui-develop/components/dialogs/window/minimizing-fullscreen).
* When the Window itself has focus, the arrow keys move it by a fixed step.
* The `move` event fires during dragging and its `end` field is `true` when the user drops the Window.
* The Window cannot be dragged above the top edge of the viewport.

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

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

## Suggested Links

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