-
lazyload
-
Description
Loads an image once it is in a certain margin in the viewport. This includes vertical and horizontal scrolling.
Parameters
Name Type Description rootMarginstring The root element's bounding box before the intersection test is performed. Default: 0px.
thresholdnumber The percentage of the image's visibility at which point the image should load. Default: 0.1 (10%).
Returns
Examples
NOTE: The following is in React. For further examples, see the Packages tab. When using the plugin make sure to add dimensions, otherwise the images will load with the size of 0x0, meaning the images will be in the viewport and trigger the lazyload plugin.
<AdvancedImage style={{width: "400px", height: "400px"}} cldImg={img} plugins={[lazyload({rootMargin: '0px', threshold: 0.25})]} />Details