Image with low resolution support. Low res image is loaded and once high res is ready, low res is replaced with high res.
yarn add @humblejs/img
Name | Type / Description | Is Required? | Default |
---|---|---|---|
className |
string Extra class on top of default co-img |
No | Empty |
src |
string High resolution image source |
Yes | |
srcLowResolution |
string Low resolution image source |
No | src value |
alt |
string Image alt tag |
Yes | |
fallback |
component Fallback component when image could not be loaded. This acts as a placeholder for error. |
No | |
onLoad |
func Callback when high-res image was successfully loaded |
No | |
onError |
func Callback if there was problem in loading image |
No | |
type |
string (img , div ) Load <img> tag or <div> with background image tag |
No | img |