shadow
Komponent Masonry vytvára responzívne "Masonry" rozvrhnutie podriadených prvkov, ktoré sú dynamicky usporiadané do stĺpcov na základe zadaných atribútov. Podporuje prispôsobenie počtu stĺpcov, maximálnej šírky stĺpcov, medzery medzi prvkami a debouncing na optimalizáciu výkonu.
Použitím atribútu max-col-width
obmedzíte šírku stĺpcov na zadanú hodnotu.
Použitím atribútu gap
určíte šírku medzery medzi stĺpcami v pixeloch.
Description | Defines the number of columns. For auto , selects the number of columns according to the width of the parent. |
Attribute | inches |
Type | string | undefined |
Default | auto |
Description | Specifies the time in ms for the layout to reformat for each change in masonry layout size. This reflow is delayed to prevent the layout algorithm from being invoked too often in succession. |
Attribute | debounce |
Type | string | undefined |
Default | 300 |
Description | Defines the width of the space between columns in pixels. |
Attribute | gap |
Type | string | undefined |
Default | 24 |
Description | Sets the maximum width of the columns in pixels. |
Attribute | max-col-width |
Type | string | undefined |
Default | 500 |
No events available for this component.
No public methods available for this component.
Name | Description |
---|
column | Refers to all columns inside the element. |
column-index | Refers to a specific column element within an element, where index represents the column order. The order starts with zero. |
native | Refers to a div element inside an element. |
Name | Description |
---|
--wj-masonry-layout-col-count | Defines the number of columns in the masonry layout. |
--wj-masonry-layout-gap | Specifies the gap between items in the masonry layout. |
Name | Description |
---|
{index} | The contents are placed in a column, index represents the column order. |