Img

Image with low resolution support. Low res image is loaded and once high res is ready, low res is replaced with high res.

Demo

Install

yarn add @humblejs/img

Props

| Name | Type / Description | Is Required? | Default | |-----------|----------|-------------|-------------| | className | stringExtra class on top of default co-img | No | Empty | | src | stringHigh resolution image source | Yes | | | srcLowResolution | stringLow resolution image source | No | src value | | alt | stringImage alt tag | Yes | | | fallback | componentFallback component when image could not be loaded. This acts as a placeholder for error. | No | | | onLoad | funcCallback when high-res image was successfully loaded | No | | | onError | funcCallback if there was problem in loading image | No | | | type | string (img, div) Load <img> tag or <div> with background image tag | No | img |