Table of Contents
Examples
Basic UsageResize Dimension
JavaScript Reference
ConstructorRequirements
Attributes
Properties
Methods
Basic Usage
Set the initial height and width using normal styles.
<k-resize
style="height: 200px; width: 200px;"
>
Resize Me
</k-resize>
Resize Me
Set the minimum and maximum height and width using normal styles. The default min-height and min-width is 10rem
and the default max-height and max-width is 100%
.
<k-resize
style="min-height: 100px; height: 200px; max-height: 300px; min-width: 100px; width: 200px; max-width: 300px;"
>
Resize Me
</k-resize>
Resize Me
Resize Dimension
<k-resize
style="height: 200px; width: 200px;"
dimention="width"
>
Resize Width
</k-resize>
Resize Width
<k-resize
style="height: 200px; width: 200px;"
dimention="height"
>
Resize Height
</k-resize>
Resize Height
* Notes
Additional styles may be added to the example output (borders, spacing, colors) for demonstration.
JavaScript Reference
Constructor
Extends Component
new Resize()
Requirements
Attributes
resizing: string
Indicates which handle is currently being used to resize the element.
dimention: string
Specifies which dimension to resize. Can be "width"
or "height"
.
Properties
resizing: string
Indicates which handle is currently being used to resize the element.
Methods
render(force): Promise
Renders the component. If force
is true
, the component will be re-rendered even if it has already been rendered.