ComboStrap - Lazy Loading
Table of Contents
About
lazy loading is the loading of resources such as image only when:
- they are on the screen (ie visible)
- or are going to enter on the screen
ComboStrap supports and enables by default the lazy loading of:
Background color
While the image is loading, the user will see a background-color as placeholder that appears with a fade effect.
The default color is set in the configuration lazyLoadingPlaceholderColor but you can change it with the standard background-color attribute.
- You can use a color value
- You can use a css color value
- You can't use a bootstrap color value
Example with a dark color.
{{:docs:block:stock_image_surfer_in_the_see.png?300&background-color=#6c757d&spacing=p-3|}}
We have added padding (spacing=p-3) to be able to see the background. Without the spacing attribute, the background-color is only seen when the image is loading
Configuration
lazyLoadingPlaceholderColor
If the media loaded is heavy, the user sees a box with a background color that fades gracefully.
With this configuration, you can change the placeholder background color.
By default, the value is: #cbf1ea