https://github.com/dmitriyakkerman/lazy-img
Simple images lazy load module
https://github.com/dmitriyakkerman/lazy-img
lazy-load lazy-load-img lazy-loading
Last synced: 3 months ago
JSON representation
Simple images lazy load module
- Host: GitHub
- URL: https://github.com/dmitriyakkerman/lazy-img
- Owner: dmitriyakkerman
- Created: 2021-11-02T19:19:50.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-11-26T13:12:33.000Z (over 3 years ago)
- Last Synced: 2025-02-15T06:16:52.728Z (4 months ago)
- Topics: lazy-load, lazy-load-img, lazy-loading
- Language: JavaScript
- Homepage:
- Size: 40 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# lazy-img
Simple images lazy load module
**Usage**
1. Create image element with _**data-srс**_ attribute:
```html
![]()
```
2. Connect lazy-img.min.js.
```js
```
3 .Init plugin.
```js
LazyImg.init() // all 'img' tags with default "rootMargin" and "threshold"
LazyImg.init(".lazy") // specific img selector with default "rootMargin" and "threshold"
LazyImg.init(".lazy", "50px", 0.5) // specific img selector with specific "rootMargin" and "threshold"
```
**Params**
##### `param1`
Target element.
*Type:* String
*Required:* false
*Default:* 'img'
##### `param2`
RootMargin. Native Intersection Observer parameter for margin around the image element.
*Type:* String
*Required:* false
*Default:* '0px'
##### `param3`
Threshold. Native Intersection Observer parameter which indicates at what percentage of the image element visibility the lazy loading should be executed.
*Type:* Number
*Required:* false
*Default:* 0