New to Kendo UI for jQuery? Download free 30-day trial

Make Popup Appear in Center

The Kendo UI Window gains focus when it is opened or initialized through the visible parameter. This makes the browser scroll the page to bring the Window into view, which creates alignment issues when a popup is implemented and expected to show in the center of the browser viewport.

To avoid this behavior and to be able to properly position the popup, it is recommended that you initialize the widget with the visible: false configuration, and then call the open() and center() methods.

The example below demonstrates how to position a popup in the center of the browser viewport.

    <button>Create and open popup</button>
     <div id="windowForAssign"></div>
       var kendoWindowAssign = $("#windowForAssign");
       var title = "Sample title";
       var url = "";

       function createAndShowPopup(){
           width: "650px",
           modal: true,
           height: '120px',
           iframe: true,
           resizable: false,
           title: title,
           content: url,
           visible: false

         var popup = $("#windowForAssign").data('kendoWindow');;;

See Also

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

In this article
Not finding the help you need? Improve this article