https://github.com/frzkn/use-images-loaded
🖼️ Returns true once all the images inside a container are loaded
https://github.com/frzkn/use-images-loaded
custom hooks images load onload react
Last synced: about 1 year ago
JSON representation
🖼️ Returns true once all the images inside a container are loaded
- Host: GitHub
- URL: https://github.com/frzkn/use-images-loaded
- Owner: frzkn
- License: mit
- Created: 2020-06-30T12:04:45.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-07-14T16:22:28.000Z (almost 3 years ago)
- Last Synced: 2025-02-03T05:47:49.950Z (over 1 year ago)
- Topics: custom, hooks, images, load, onload, react
- Language: JavaScript
- Homepage: https://use-images-loaded.netlify.app/
- Size: 1.22 MB
- Stars: 85
- Watchers: 3
- Forks: 5
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## 🖼️ useImagesLoaded
Custom react hook which returns true once all the images inside a container are loaded.
Check out a working demo [here](https://use-images-loaded.netlify.app)
### 🚀 Getting Started
#### Installation
```
yarn add use-images-loaded
```
#### Usage
Displaying a loading indicator while images are loading in a container
```
import useImageLoaded from 'use-images-loaded'
const ImageContainer = () => {
const [ref, loaded] = useImagesLoaded()
return (
Status: {loaded ? 'Loaded': 'Loading'}
)
}
```