#

API Docs for: 3.10.3
Show: Inherited Protected Private Deprecated

# Plugin.ResizeConstrained Class

Defined in: `resize/js/resize-constrain.js:43`
Module: resize-contrain
Parent Module: resize

A Resize plugin that will attempt to constrain the resize node to the boundaries.

- Index
- Methods
- Properties
- Attributes

## Item Index

### Methods

- _checkConstrain
- _checkHeight
- _checkRatio
- _checkRegion
- _checkWidth
- _getConstrainRegion

### Properties

- constrainSurrounding

### Attributes

- constrain
- maxHeight
- maxWidth
- minHeight
- minWidth
- preserveRatio
- tickX
- tickY

## Methods

### `_checkConstrain`

(

- `axis`
- `axisConstrain`
- `offset`

)
protected

Defined in `resize/js/resize-constrain.js:195`

Helper method to update the current values on info to respect the constrain node.

#### Parameters:

- `axis` String

  'top' or 'left'

- `axisConstrain` String

  'bottom' or 'right'

- `offset` String

  'offsetHeight' or 'offsetWidth'

### `_checkHeight`

() protected

Defined in `resize/js/resize-constrain.js:235`

Update the current values on info to respect the maxHeight and minHeight.

### `_checkRatio`

() protected

Defined in `resize/js/resize-constrain.js:260`

Update the current values on info calculating the correct ratio for the other values.

### `_checkRegion`

() Boolean protected

Defined in `resize/js/resize-constrain.js:350`

Check whether the resizable node is inside the constrain region.

#### Returns:

Boolean:

### `_checkWidth`

() protected

Defined in `resize/js/resize-constrain.js:365`

Update the current values on info to respect the maxWidth and minWidth.

### `_getConstrainRegion`

() Object Region protected

Defined in `resize/js/resize-constrain.js:390`

Get the constrain region based on the `constrain` attribute.

#### Returns:

Object Region:

## Properties

### `constrainSurrounding`

Object

Defined in `resize/js/resize-constrain.js:168`

Stores the `constrain` surrounding information retrieved from _getBoxSurroundingInfo.

Default: null

## Attributes

### `constrain`

String | Object | Node

Defined in `resize/js/resize-constrain.js:64`

Will attempt to constrain the resize node to the boundaries. Arguments:
'view': Contrain to Viewport
'#selector_string': Constrain to this node
'{Region Object}': An Object Literal containing a valid region (top, right, bottom, left) of page positions

#### Fires event `constrainChange`

Fires when the value for the configuration attribute `constrain` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `maxHeight`

Number

Defined in `resize/js/resize-constrain.js:107`

The maximum height of the element

Default: Infinity

#### Fires event `maxHeightChange`

Fires when the value for the configuration attribute `maxHeight` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `maxWidth`

Number

Defined in `resize/js/resize-constrain.js:119`

The maximum width of the element

Default: Infinity

#### Fires event `maxWidthChange`

Fires when the value for the configuration attribute `maxWidth` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `minHeight`

Number

Defined in `resize/js/resize-constrain.js:83`

The minimum height of the element

Default: 15

#### Fires event `minHeightChange`

Fires when the value for the configuration attribute `minHeight` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `minWidth`

Number

Defined in `resize/js/resize-constrain.js:95`

The minimum width of the element

Default: 15

#### Fires event `minWidthChange`

Fires when the value for the configuration attribute `minWidth` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `preserveRatio`

Boolean

Defined in `resize/js/resize-constrain.js:131`

Maintain the element's ratio when resizing.

Default: false

#### Fires event `preserveRatioChange`

Fires when the value for the configuration attribute `preserveRatio` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `tickX`

Number | false

Defined in `resize/js/resize-constrain.js:143`

The number of x ticks to span the resize to.

Default: false

#### Fires event `tickXChange`

Fires when the value for the configuration attribute `tickX` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.

### `tickY`

Number | false

Defined in `resize/js/resize-constrain.js:154`

The number of y ticks to span the resize to.

Default: false

#### Fires event `tickYChange`

Fires when the value for the configuration attribute `tickY` is changed. You can listen for the event using the `on` method if you wish to be notified before the attribute's value has changed, or using the `after` method if you wish to be notified after the attribute's value has changed.

#### Parameters:

- `e` EventFacade
  An Event Facade object with the following attribute-specific properties added:
  - `prevVal` Any
    The value of the attribute, prior to it being set.
  - `newVal` Any
    The value the attribute is to be set to.
  - `attrName` String
    The name of the attribute being set.
  - `subAttrName` String
    If setting a property within the attribute's value, the name of the sub-attribute property being set.