jQuery/JS Common - Object Structures - positionConfig - collision
A string passed to this option should contain a collision handler name, or a pair of names separated by space. If the string consists of a single collision handler name, it is applied to both horizontal and vertical axes. If you pass a pair of names separated by space, the first collision handler will be applied to the horizontal axis, the second to the vertical axis.
- // a string containing horizontal and vertical
- // collision handlers separated by space
- collision: "flip fit";
You can also specify different collision handlers for horizontal and vertical axes in one of the following ways.
- // an object containing 'x' and 'y' fields
- collision: {
- x: "flip", // horizontal collision handler
- y: "none" // vertical collision handler
- }
The available collision handler names are:
- none
Collisions do not affect widget position. - flip
Moves the widget to the opposite side of the target element if it allows more of the widget to be visible. - fit
Shifts the widget from outside of the screen to fully display the widget. - flipfit
Applies the fit collision handler after flip.
When using a widget as an ASP.NET MVC Control, specify this option using the PositionResolveCollision
enum in the following manner. This enum accepts the following values: Fit
, Flip
, FlipFit
and None
.
- @(Html.DevExtreme().WidgetName()
- .Position(p => p
- .Collision(PositionResolveCollision.Fit, PositionResolveCollision.Flip)
- )
- )
- @(Html.DevExtreme().WidgetName() _
- .Position(Sub(p)
- p.Collision(PositionResolveCollision.Fit, PositionResolveCollision.Flip)
- End Sub)
- )
If you have technical questions, please create a support ticket in the DevExpress Support Center.