This is a migrated thread and some comments may be shown as answers.

Kendo Menu within Kendo Window positioning.

2 Answers 117 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Thomas
Top achievements
Rank 1
Thomas asked on 31 Jul 2015, 01:36 AM

I have a kendo menu inside of a kendo window and would like the menu to draw over top of the window. 
Here is an example: http://dojo.telerik.com/epezo/2

 The problem is that the menu expands within the window, the desired behaviour is for it to expand over the window in a similar way as this drop down list in this link: http://dojo.telerik.com/URODA/2.



 ​

2 Answers, 1 is accepted

Sort by
0
Thomas
Top achievements
Rank 1
answered on 31 Jul 2015, 01:41 AM

Here is the code in the two links in case they don't work.
Menu.​html is demonstrates the problem, the menu opens up and pushes against it's container.

Dropdown.html demonstrates the desired behaviour.

0
Konstantin Dikov
Telerik team
answered on 03 Aug 2015, 01:32 PM
Hi Thomas,

The behavior that you are observing is expected, because the Menu is rendered within the Window widget and the overflow property of the window's content element is set to "auto", which will force the window to display a scrollbar if the content exceeds the size of the wrapping container.

In the DropDownList example, the drop down element is rendered outside the window (as a child of the BODY element) and it is positioned over the SPAN element of the DropDownList widget, which is the reason for the different behavior. 

With the above in mind, you could try to override the overflow property of the content element of the window with the following:
<style>
  div.k-window-content{
    overflow: visible;
  }
</style>

Here is the modified example:
However, you should have in mind that if you resize the window, if the size is smaller than the initially calculated one, the content will move outside the window. 

Another approach for handling this would be to set the position property of the Menu to "fixed" and manually calculate and position it over the window.


Best Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Menu
Asked by
Thomas
Top achievements
Rank 1
Answers by
Thomas
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or