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:
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.
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI