3 Answers, 1 is accepted
0
Hello Bob,
The desired behavior is possible to achieve, but not automatically. You need to do the following:
- measure the browser viewport size
- use explicit Window width and height
- calculate and set an appropriate Window position, based on the above
http://docs.telerik.com/kendo-ui/api/web/window#configuration-position
The above can also be done after Window initialization. In this case you have the freedom to not set explicit Window dimensions, but measure them.
http://docs.telerik.com/kendo-ui/api/web/window#methods-setOptions
Regards,
Dimo
Telerik
The desired behavior is possible to achieve, but not automatically. You need to do the following:
- measure the browser viewport size
- use explicit Window width and height
- calculate and set an appropriate Window position, based on the above
http://docs.telerik.com/kendo-ui/api/web/window#configuration-position
The above can also be done after Window initialization. In this case you have the freedom to not set explicit Window dimensions, but measure them.
http://docs.telerik.com/kendo-ui/api/web/window#methods-setOptions
Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Bob
Top achievements
Rank 1
answered on 21 Aug 2014, 12:11 PM
Do you know of a pure CSS way to do this? I played around with position fixed and absolute for a few minutes but it didn't work out so well.
0
Hello Bob,
A "relatively" pure CSS way would be to override the standard Window behavior:
1) reset the top and left styles of the widget wrapper element (div.k-window) to "auto"
2) apply bottom and right stylesto the same element
However, this will cause unexpected side effects related to resizing and dragging and you have to be prepared for limitations of this appoach.
http://dojo.telerik.com/EloM
A variation of the above technique is to use external styles with !important, instead of inline styles. This will require you to apply a custom class to the Window wrapper element, otherwise the custom styles will target all Window instances on the page (or in the application). Since the custom CSS class will be applied with Javascript, a 100% pure CSS solution (in case you are after it) does not exist.
Regards,
Dimo
Telerik
A "relatively" pure CSS way would be to override the standard Window behavior:
1) reset the top and left styles of the widget wrapper element (div.k-window) to "auto"
2) apply bottom and right stylesto the same element
However, this will cause unexpected side effects related to resizing and dragging and you have to be prepared for limitations of this appoach.
http://dojo.telerik.com/EloM
A variation of the above technique is to use external styles with !important, instead of inline styles. This will require you to apply a custom class to the Window wrapper element, otherwise the custom styles will target all Window instances on the page (or in the application). Since the custom CSS class will be applied with Javascript, a 100% pure CSS solution (in case you are after it) does not exist.
Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!