Navigation and Layout - Panel Responsive Layout

The ASP.NET MVC Panel extension allows you to build adaptive page layouts with ease.

The Panel extension can collapse or hide its content. To enable collapse functionality, the Collapsible property is set to true. When the collapse functionality is enabled, the Panel extension can function adaptively, i.e., it can automatically collapse or hide its content when the browser window is resized. In this demo, the adaptivity behavior is defined for individual panels using options accessible via the SettingsAdaptivity property.

Collapsing Content.
The panel collapses its content when any of the browser window dimensions is less than the values defined by the CollapseAtWindowInnerHeight and CollapseAtWindowInnerWidth properties.

Hiding Content.
The panel hides its content when any of the browser window dimensions is less than the values defined by the HideAtWindowInnerHeight and HideAtWindowInnerWidth properties.

End-users can expand the collapsed panel. The panel allows you to define the content that will be displayed within the expanded panel. In this demo, the panel with the Name "topPanel" displays a horizontal menu when the screen width is greater than 580px, and displays a vertically oriented menu when the screen width is less than 580px and the panel is expanded. The expanded panel content is defined using the SetExpandedPanelTemplateContent method.

Version: v2017 vol 1.7
Copyright © 2006-2017 Developer Express Inc
Your Next Great MVC App Starts Here

Get started today and download your 30-day trial of DevExpress MVC Extensions (includes 30 days of free technical support).

All demos ship with full source code and are included in the DevExpress MVC distribution. Refer to the Demos and Sample Applications topic to learn more.

DevExpress MVC Extensions ship as part of DevExpress Universal, DXperience and ASP.NET Subscriptions and are backed by a 60 day unconditional money-back guarantee.
To learn more and obtain pricing information, visit the Compare Features and Pricing webpage. For immediate assistance, contact us by Email at or by phone at +1 (818) 844-3383 between 7:30am and 4:30pm Pacific Time.