MasonryInfiniteGridOptions

MasonryInfiniteGridOptions

Type: TSInterface

PROPERTY	TYPE	DESCRIPTION
horizontal	boolean	Direction of the scroll movement. (true: horizontal, false: vertical) If horizontal is false, inlinePos is left, inlineSize is width, contentPos is top, and contentSize is height. If horizontal is true, inlinePos is top, inlineSize is height, contentPos is left, and contentSize is width. (default: false)
percentage	Array<"position" | "size"> | boolean	Whether to set the css size and position of the item to %. (default: false)
isEqualSize	boolean	Indicates whether sizes of all card elements are equal to one another. If sizes of card elements to be arranged are all equal and this option is set to "true", the performance of layout arrangement can be improved. (default: false)
isConstantSize	boolean	Indicates whether sizes of all card elements does not change, the performance of layout arrangement can be improved. (default: false)
gap	number	Gap used to create space around items. (default: 5)
attributePrefix	string	The prefix to use element's data attribute. (default: "data-grid-")
resizeDebounce	number	Debounce time to set in the resize event. (default: 100)
maxResizeDebounce	number	Maximum time to debounce the resize event(0 is not set). (default: 0)
autoResize	boolean	Whether to move the outline to 0 when the top is empty when rendering. However, if it overflows above the top, the outline is forced to 0. (default: true)
useFit	boolean	Whether the resize method should be called automatically after a window resize event. (default: true)
useTransform	boolean	Whether to use transform property instead of using left and top css properties.
renderOnPropertyChange	boolean	Whether to automatically render through property change.
preserveUIOnDestroy	boolean	Whether to preserve the UI of the existing container or item when destroying.
defaultDirection	"start" | "end"	The default direction value when direction is not set in the render option.
externalItemRenderer	ItemRenderer | null	You can set the ItemRenderer directly externally.
externalContainerManager	ContainerManager | null	You can set the ContainerManager를 directly externally.
column	number	The number of columns. If the number of columns is 0, it is automatically calculated according to the size of the container.
columnSize	number	The size of the columns. If it is 0, it is calculated as the size of the first item in items. (default: 0)
columnSizeRatio	number	The size ratio(inlineSize / contentSize) of the columns. 0 is not set. (default: 0)
align	GridAlign	Align of the position of the items. If you want to use stretch, be sure to set column or columnSize option. ("start", "center", "end", "justify", "stretch") (default: "justify")
horizontal	boolean	Direction of the scroll movement. (true: horizontal, false: vertical) If horizontal is false, inlinePos is left, inlineSize is width, contentPos is top, and contentSize is height. If horizontal is true, inlinePos is top, inlineSize is height, contentPos is left, and contentSize is width. (default: false)
percentage	Array<"position" | "size"> | boolean	Whether to set the css size and position of the item to %. (default: false)
isEqualSize	boolean	Indicates whether sizes of all card elements are equal to one another. If sizes of card elements to be arranged are all equal and this option is set to "true", the performance of layout arrangement can be improved. (default: false)
isConstantSize	boolean	Indicates whether sizes of all card elements does not change, the performance of layout arrangement can be improved. (default: false)
gap	number	Gap used to create space around items. (default: 5)
attributePrefix	string	The prefix to use element's data attribute. (default: "data-grid-")
resizeDebounce	number	Debounce time to set in the resize event. (default: 100)
maxResizeDebounce	number	Maximum time to debounce the resize event(0 is not set). (default: 0)
autoResize	boolean	Whether to move the outline to 0 when the top is empty when rendering. However, if it overflows above the top, the outline is forced to 0. (default: true)
useFit	boolean	Whether the resize method should be called automatically after a window resize event. (default: true)
useTransform	boolean	Whether to use transform property instead of using left and top css properties.
renderOnPropertyChange	boolean	Whether to automatically render through property change.
preserveUIOnDestroy	boolean	Whether to preserve the UI of the existing container or item when destroying.
defaultDirection	"start" | "end"	The default direction value when direction is not set in the render option.
externalItemRenderer	ItemRenderer | null	You can set the ItemRenderer directly externally.
externalContainerManager	ContainerManager | null	You can set the ContainerManager를 directly externally.
container	boolean | string | HTMLElement	The target to which the container is applied. If false, create itself, if true, create container. A string or HTMLElement specifies the target directly. (default: false)
containerTag	string	If you create a container, you can set the container's tag. (default: "div")
threshold	number	The size of the scrollable area for adding the next group of items. (default: 100)
useRecycle	boolean	Whether to show only the DOM of the visible area. (default: true)
gridConstructor	GridFunction	Grid class to apply Infinite function.
renderer	Renderer | null	class that renders the DOM.