Skip to main content

SplitterSettings.FullscreenMode Property

Gets or sets whether the Splitter is used in a full-screen mode.

Namespace: DevExpress.Web.Mvc

Assembly: DevExpress.Web.Mvc5.v23.2.dll

NuGet Package: DevExpress.Web.Mvc5

Declaration

public bool FullscreenMode { get; set; }

Property Value

Type Description
Boolean

true to enable full-screen mode; otherwise, false.

Remarks

To enable the full-screen mode for a Splitter, set the FullscreenMode property to true. In this case, the Splitter fills the entire page and can be resized together with the browser window.

The ASPxSplitter control must be a root element when it works in the full-screen mode. It can be placed in a simple containers, like div or form elements only. Other controls cannot be placed at the same level.

Run Demo: Splitter - Fullscreen Mode

Example

splitter-pane-orientation

@Html.DevExpress().Splitter(
     settings => {
          settings.Name = "splFullScreenMode";
          settings.Orientation = Orientation.Vertical;
          settings.FullscreenMode = true;
          settings.Panes.Add(pane => {
               ...
     }).GetHtml()

When you set the FullscreenMode property to true, the Height and Width properties are set to a value of 100%. Specific style settings are applied to page elements (such as HTML, BODY, FORM) on the client side, to disable default page padding, margin and scrolling settings and set the height of these container elements to 100%.

<style type="text/css">
     html, body, form {
          height: 100%;
          margin: 0;
          padding: 0;
          overflow: hidden;
     }
</style>
See Also