ASPxPopupControl.PopupHorizontalAlign Property
Gets or sets a popup window’s horizontal alignment.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v20.2.dll
NuGet Package: DevExpress.Web
Declaration
[DefaultValue(PopupHorizontalAlign.NotSet)]
public PopupHorizontalAlign PopupHorizontalAlign { get; set; }Property Value
| Type | Default | Description |
|---|---|---|
| PopupHorizontalAlign | **NotSet** | One of the PopupHorizontalAlign enumeration values. |
Available values:
| Name | Description |
|---|---|
| NotSet | A popup element is displayed on the x-coordinate of the mouse cursor position.
|
| OutsideLeft | A popup element is displayed to the left of the corresponding HTML element, so that the x-coordinate of the popup element’s right border is equal to the x-coordinate of the HTML element’s left border.
|
| LeftSides | A popup element is displayed so that its left border’s x-coordinate equals the x-coordinate of the corresponding HTML element’s left border.
|
| Center | A popup element is displayed so that the x-coordinate of the popup element’s center equals the x-coordinate of the corresponding HTML element’s center.
|
| RightSides | A popup element is displayed so that the x-coordinate of the popup element’s right border equals the x-coordinate of the corresponding HTML element’s right border.
|
| OutsideRight | A popup element is displayed to the right of the corresponding HTML element so that the x-coordinate of the popup element’s left border is equal to the x-coordinate of the HTML element’s right border.
|
| WindowCenter | A popup element is displayed so that it is horizontally aligned at the center of the browser’s window. |
Remarks
The default popup window (or all popup windows from the ASPxPopupControl.Windows collection) is aligned horizontally on the x-coordinate of the mouse cursor position by default. Use the PopupHorizontalAlign property to set the window alignment relative to the corresponding element specified by the ASPxPopupControl.PopupElementID (PopupWindow.PopupElementID) property, or to display the window at the center of the browser’s window.
Note
Use the HorizontalAlign and VerticalAlign properties to align a popup in adaptive mode.
Example
This example demonstrates the following capabilities of the ASPxPopupControl when its popup window is used in modal mode:
- The ShowPageScrollbarWhenModal property allows the browser's vertical scrollbar to be displayed providing end-users with a capability to scroll the document content while the modal popup window is being shown;
- The AutoUpdatePosition property controls whether the popup window's position should be automatically recalculated after performing some popup window resizing or document scrolling operations.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v9.1" Namespace="DevExpress.Web.ASPxPopupControl" TagPrefix="dxpc" %>
<%@ Register Assembly="DevExpress.Web.ASPxEditors.v9.1" Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dxe" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<dxe:ASPxCheckBox ID="cbShowPageScrollbarWhenModal" runat="server" Text="ShowPageScrollbarWhenModal" />
<br />
<dxe:ASPxCheckBox ID="cbAutoUpdatePosition" runat="server" Text="AutoUpdatePosition" />
<br />
<dxe:ASPxButton ID="btnShow" runat="server" Text="Show">
</dxe:ASPxButton>
<dxpc:ASPxPopupControl ID="popup" runat="server" ShowOnPageLoad="true" PopupElementID="ASPxButton1" Modal="True"
ShowPageScrollbarWhenModal="False" PopupHorizontalAlign="WindowCenter" PopupVerticalAlign="WindowCenter" HeaderText="Gladiator" AllowDragging="True" AllowResize="True" EnableAnimation="False">
<ContentCollection>
<dxpc:PopupControlContentControl runat="server">
<span class="Gray"><b>Directed by:</b> Ridley Scott<br />
<b>Year:</b> 2000</span><br />
<br />
<div style="font-family: Tahoma; font-size: 10px; color: #666666;">
When a Roman general is betrayed and his family murdered by a corrupt prince, he
comes to Rome as a gladiator to seek revenge.</div>
</dxpc:PopupControlContentControl>
</ContentCollection>
<ClientSideEvents Init="function(s, e) { s.Show(); }" />
</dxpc:ASPxPopupControl>
<div style="height: 2000px" />
</div>
</form>
</body>
</html>