Edit this page

Use Windows as Sliding Panes

You can configure the Kendo UI Window so it acquires the visual effect of a sliding UI component.

The following example demonstrates how to make the Window behave as a sliding pane.

<div id="dialog">
  <p>Some content</p>

<a href="#" id="openWindow" class="k-button">Open</a>

    title: "Title",
    width: "60%",
    height: "94%",
    actions: [ "close" ],
    draggable: false,
    resizable: false,
    modal: true,
      top: 0,
      left: "40%"
    animation: {
        open: {
        effects: "slideIn:left",
        duration: 500
      close: {
        effects: "slideIn:left",
        reverse: true,
        duration: 500
    visible: false

    var dialog = $("#dialog").getKendoWindow();

See Also

Other articles and how-to examples on the Kendo UI Window:

For more runnable examples on the Kendo UI Window, browse the How To documentation folder.

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article