Layzyload images
- Source:
Members
(private, static) images :array
The array for all the images to be lazy loaded
- Type:
- array
- Source:
- Type:
- object
- Source:
- Type:
- number
- Source:
- Source:
- Source:
- Type
- external:jQuery
- Source:
- Source:
- Type
- external:jQuery
- Source:
- Type
- string
- Source:
- Source:
- Type
- external:jQuery
(private, static, constant) range :object
Ranges for targeting sizes in srcset
(private, static, constant) threshold :number
The threshold for when images in view should be loaded
Methods
(static) init()
Initialize the component
(static) load(id) → {external:jQuery}
Loads a given image
Parameters:
| Name | Type | Description |
|---|---|---|
| id | external:jQuery | string | jQuery element or selector |
Returns:
jQuery elements targeted
(private, static) loadImagesInView()
Loads all images with data-defer="view" attribute if they are within the viewport threshold
(private, static) loadImagesOnLoad() → {external:jQuery}
Loads all images with data-defer="load" attribute
Returns:
jQuery elements targeted
(private, static) parseSrcset(srcset, size) → {string}
Parse the data-srcset and return the url that matches given size
Parameters:
| Name | Type | Description |
|---|---|---|
| srcset | string | A srcset formatted string |
| size | string | A string used in the regex to match a spesific size |
Returns:
the url matching size
(static) reflow()
Load all images that can be loaded
(private, static) setImageSrc(id) → {external:jQuery}
Set the image src based on width of page and what is in data-srcset or data-src
Parameters:
| Name | Type | Description |
|---|---|---|
| id | external:jQuery | string | jQuery element or selector |
Returns:
jQuery element