JavaScript/jQuery LoadPanel - Resize and Relocate
Specify the height and width properties to change the LoadPanel's size:
JavaScript
- $(function() {
- $("#loadPanelContainer").dxLoadPanel({
- hideOnOutsideClick: true,
- height: 300,
- width: 500
- });
- $("#buttonContainer").dxButton({
- text: "Show the Load Panel",
- onClick: function () {
- $("#loadPanelContainer").dxLoadPanel("show");
- }
- });
- });
The container property specifies the LoadPanel's container. The container is shaded when the LoadPanel is visible; the LoadPanel inherits styles from the container and is scrolled with. To position the UI component relative to a specific element, use the position property:
JavaScript
- $(function() {
- $("#loadPanelContainer").dxLoadPanel({
- hideOnOutsideClick: true,
- container: "#container",
- position: { my: "left", at: "left", of: "#targetElement" }
- });
- $("#buttonContainer").dxButton({
- text: "Show the Load Panel",
- onClick: function () {
- $("#loadPanelContainer").dxLoadPanel("show");
- }
- });
- });
This configuration of the position property reads as follows: "place my left side at the left of the "#targetElement".
See Also
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.