3.0.3 • Published 6 years ago
react-progressive-image-loading v3.0.3
React Progressive Image Loading
Progressively load images using a blur effect.
Installation
$ npm install react-progressive-image-loading --save
Import
import ProgressiveImage from "react-progressive-image-loading";
Usage
<ProgressiveImage
preview="/images/tiny-preview.png"
src="/images/preview.png"
render={(src, style) => <img src={src} style={style} />}
/>
Instead of using the img
tag, you can use background-image
with a div
.
<ProgressiveImage
preview="/images/tiny-preview.png"
src="/images/preview.png"
render={(src, style) => <div style={Object.assign(style, { backgroundImage: `url(${src})` })} />}
/>
You can also customize the transition time and the timing function used for that transition.
<ProgressiveImage
preview="/images/tiny-preview.png"
src="/images/preview.png"
transitionTime={500}
transitionFunction="ease"
render={(src, style) => <img src={src} style={style} />}
/>
3.0.3
6 years ago
3.0.2
7 years ago
3.0.1
7 years ago
3.0.0
7 years ago
2.0.3
7 years ago
2.0.2
7 years ago
2.0.1
7 years ago
2.0.0
7 years ago
1.1.0
7 years ago
1.0.10
7 years ago
1.0.9
7 years ago
1.0.8
7 years ago
1.0.7
7 years ago
1.0.6
7 years ago
1.0.5
7 years ago
1.0.4
7 years ago
1.0.3
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago